css中box-shadow屬性的功能是什么

發(fā)布時(shí)間：2022-03-01 15:22:43 來源：億速云閱讀：169 作者：小新欄目：web開發(fā)

這篇文章主要為大家展示了“css中box-shadow屬性的功能是什么”，內(nèi)容簡(jiǎn)而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領(lǐng)大家一起研究并學(xué)習(xí)一下“css中box-shadow屬性的功能是什么”這篇文章吧。

　　CSS3 box-shadow屬性

　　作用：box-shadow用于向方框添加陰影

　　基本語(yǔ)法：

　　box-shadow:h-shadowv-shadowblurspreadcolorinset;

　　參數(shù)：

　　h-shadow：水平陰影的位置。允許負(fù)值。

　　v-shadow：垂直陰影的位置。允許負(fù)值。

　　blur：模糊距離，可省略。

　　spread：陰影的尺寸，可省略。

　　color：陰影的顏色，可省略。

　　inset：將外部陰影(outset)改為內(nèi)部陰影，可省略。

　　說明：box-shadow向框添加一個(gè)或多個(gè)陰影。該屬性是由逗號(hào)分隔的陰影列表，每個(gè)陰影由2-4個(gè)長(zhǎng)度值、可選的顏色值以及可選的inset關(guān)鍵詞來規(guī)定。省略長(zhǎng)度的值是0。

　　使用示例

<!DOCTYPEhtml>
　　<html>
　　<head>
　　<style>
　　div
　　{
　　width:300px;
　　height:100px;
　　background-color:#ff9900;
　　-moz-box-shadow:10px10px5px#888888;/*老的Firefox*/
　　box-shadow:10px10px5px#888888;
　　margin:100pxauto;
　　}
　　</style>
　　</head>
　　<body>
　　<div></div>
　　</body>
　　</html>

以上是“css中box-shadow屬性的功能是什么”這篇文章的所有內(nèi)容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內(nèi)容對(duì)大家有所幫助，如果還想學(xué)習(xí)更多知識(shí)，歡迎關(guān)注億速云行業(yè)資訊頻道！

向AI問一下細(xì)節(jié)

css中box-shadow屬性的功能是什么

猜你喜歡

最新資訊

相關(guān)推薦

相關(guān)標(biāo)簽