溫馨提示×
您好，登錄后才能下訂單哦！
點擊 登錄注冊 即表示同意《億速云用戶服務條款》
您好，登錄后才能下訂單哦！
這篇文章主要為大家展示了“css怎么設置標題陰影邊框”，內容簡而易懂，條理清晰，希望能夠幫助大家解決疑惑，下面讓小編帶領大家一起研究并學習一下“css怎么設置標題陰影邊框”這篇文章吧。
方法：1、利用border屬性給標題元素添加邊框，語法“border:寬度 樣式 顏色;”；2、利用“text-align: center”實現標題文本居中；3、使用box-shadow屬性給標題元素的邊框添加陰影效果。
本教程操作環境：windows7系統、CSS3&&HTML5版、Dell G3電腦。
css如何設置標題陰影邊框？
我們來講一下css如何標題添加陰影邊框。
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title></title>
<style>
div
{
width:200px;
height:200px;
border:2px solid red;
text-align: center;
margin: 20px auto;
line-height: 200px;
box-shadow: red 10px 30px 5px;
}
</style>
</head>
<body>
<div>億速云</div>
</body>
</html>代碼效果
css陰影邊框使用語法：
屬性：box-shadow
使用方法：div{box-shadow: 001px #000inset;}
陰影使用方法分析：第一個零代表距離對象左邊距離為0，并且開始顯示陰影，第二個零表示距離對象上間距對象為0，就開始顯示陰影，1px表示陰影的范圍1px，#000代表著陰影的顏色，inset表示對象內陰影，對象外就不設置陰影。
兼容問題：火狐瀏覽器3.5版本和谷歌都是可以支持box-shadow屬性。
以上是“css怎么設置標題陰影邊框”這篇文章的所有內容，感謝各位的閱讀！相信大家都有了一定的了解，希望分享的內容對大家有所幫助，如果還想學習更多知識，歡迎關注億速云行業資訊頻道！
免責聲明：本站發布的內容（圖片、視頻和文字）以原創、轉載和分享為主，文章觀點不代表本網站立場，如果涉及侵權請聯系站長郵箱：is@yisu.com進行舉報，并提供相關證據，一經查實，將立刻刪除涉嫌侵權內容。
