⊗mkSpGfCOp 55 of 128 menu

CSSのopacityプロパティによる半透明度

要素の半透明度は、 プロパティopacityを使用しても設定できます。このプロパティも 0から1までの小数値を受け付けます。この場合、半透明度は 要素全体(そのテキスト、 背景、ボーダー)に対して同時に設定されます。

例を見てください:

<div id="parent"> <div id="elem"> Lorem ipsum dolor sit amet. </div> </div> #parent { background-image: url("bg.png"); background-repeat: no-repeat; background-size: cover; display: inline-block; padding: 30px; } #elem { width: 300px; height: 200px; padding: 10px; font-size: 50px; font-weight: bold; border: 20px solid red; background: black; color: red; opacity: 0.7; }

:

何らかの背景画像があるとします。 その上に、テキスト、ボーダー、背景を持つ2つのブロックを配置してください。 これらのブロックで、 opacityによる半透明度と rgbaによる半透明度の違いを実演してください。

日本語
AfrikaansAzərbaycanБългарскиবাংলাБеларускаяČeštinaDanskDeutschΕλληνικάEnglishEspañolEestiSuomiFrançaisहिन्दीMagyarՀայերենIndonesiaItalianoქართულიҚазақ한국어КыргызчаLietuviųLatviešuМакедонскиMelayuမြန်မာNederlandsNorskPolskiPortuguêsRomânăРусскийසිංහලSlovenčinaSlovenščinaShqipСрпскиSrpskiSvenskaKiswahiliТоҷикӣไทยTürkmenTürkçeЎзбекOʻzbekTiếng Việt
当サイトでは、サイトの動作、分析、パーソナライゼーションのためにクッキーを使用しています。 データ処理はプライバシーポリシーに従って行われます。
すべて受け入れる 設定 拒否