CSSで枠線を透明にする方法

CSS で境界線を透明にする方法: 最初に HTML サンプル ファイルを作成し、次に本文に div を作成し、最後に「border-top:10px Solid rgba(200,200,200,0.25);」スタイルを設定します。 div、つまり指定された境界線を透明にします。

この記事の動作環境: Windows7 システム、HTML5&&CSS3 バージョン、DELL G3 コンピューター

透明度は一般的に色の属性とみなされますが、しかし、そのような数値はありません。 div を透明にする最良の方法が見つかりました。RGBA

RGBA を使用すると、RGB に基づいてアルファ透明度を制御するパラメータが追加されます。 R (赤)、G (緑)、B (青) の 3 つのパラメータがあり、正の整数値の範囲は 0 ～ 255、パーセント値の範囲は 0.0% ～ 100.0% です。範囲外の値は、最も近い値の制限に丸められます。すべてのブラウザがパーセント値の使用をサポートしているわけではありません。パラメータ。値は 0 ～ 1 であり、負の値は指定できません。

RGBA 構文の例:

.div {background: rgba(200,200,200,0.5);}

次に、境界線を透明にする方法を示します:

div に次のスタイルを設定します。

div {    width: 100px;    
height:100px;    border-top:10px solid  rgba(200,200,200,0.25);    border-right:10px solid  rgba(200,200,200,0.5);    border-bottom: 10px solid  rgba(200,200,200,0.75);    border-left:10px solid  rgba(200,200,200,1);}

表示効果は図に示すとおりで、各側の透明度が異なります。境界線の透明度を設定する必要がある場合は、必要に応じて 0 ～ 1 の間の最後の値を入力するだけです。

学習ビデオ共有: css ビデオ チュートリアル

以上がCSSで枠線を透明にする方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。