站長資訊網(wǎng)
方法：1、利用border屬性給標題元素添加邊框，語法“border:寬度 樣式 顏色;”；2、利用“text-align: center”實現(xiàn)標題文本居中；3、使用box-shadow屬性給標題元素的邊框添加陰影效果。
本教程操作環(huán)境：windows7系統(tǒng)、CSS3&&HTML5版、Dell G3電腦。
css如何設(shè)置標題陰影邊框？
我們來講一下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>php中文網(wǎng)</div> </body> </html>
代碼效果
css陰影邊框使用語法：
屬性：box-shadow
使用方法：div{box-shadow: 001px #000inset;}
陰影使用方法分析：第一個零代表距離對象左邊距離為0，并且開始顯示陰影，第二個零表示距離對象上間距對象為0，就開始顯示陰影，1px表示陰影的范圍1px，#000代表著陰影的顏色，inset表示對象內(nèi)陰影，對象外就不設(shè)置陰影。
兼容問題：火狐瀏覽器3.5版本和谷歌都是可以支持box-shadow屬性。
推薦學(xué)習(xí)：CSS視頻教程
