CSS3 では、「box-shadow」属性を使用して境界線の影をキャンセルできます。この属性は、1 つ以上のドロップダウン シャドウ ボックスを設定するために使用されます。この属性の値を次のように設定するだけです。 「none」。要素の境界線の影をキャンセルできます。構文は「element {box-shadow: none;}」です。
このチュートリアルの動作環境: Windows 10 システム、CSS3&&HTML5 バージョン、Dell G3 コンピューター。
box-shadow プロパティでは、1 つ以上のドロップダウン シャドウ ボックスを設定できます。
box-shadow: h-shadow v-shadow blur spread color inset;
注: boxShadow プロパティは、ボックスに 1 つ以上のドロップダウン シャドウを追加します。このプロパティは、シェードのカンマ区切りリストであり、各シェードは 2 ~ 4 個の長さの値、オプションのカラー値、およびオプションの inset キーワードによって指定されます。省略された長さの値は 0 です。
h-shadow 必須。水平方向の影の位置。負の値が許可されます
#v-shadow 必須。垂直影の位置。負の値も許可されます
blur オプション。ファジー距離
#スプレッド オプション。影のサイズ
#カラーはオプションです。影の色。
インセット オプション。影を外側の影(先頭)から内側の影に変更します。
例は次のとおりです。
<style> div { width:300px; height:100px; background-color:yellow; box-shadow: 10px 10px 5px #888888; } </style> </head> <body> <div></div> </body>
出力結果:
none を設定すると、出力結果は次のようになります:
<style> div { width:300px; height:100px; background-color:yellow; box-shadow:none; } </style> </head> <body> <div></div> </body>
(学習ビデオ共有: css ビデオ チュートリアル 、html ビデオ チュートリアル )
以上がCSS3枠線の影を解除する方法の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。