邊框css四邊怎麼加
- 藏色散人原創
- 2021-01-05 10:34:414543瀏覽
css設定邊框四邊的方法：1、使用border-bottom屬性設定下邊框；2、使用border-left屬性設定左邊框；3、使用border-right屬性設定右邊框；4、使用border -top屬性設定上邊框。
本教學操作環境：windows7系統、css3版本，Dell G3電腦。
相關推薦：《css影片教學》
邊框css四邊怎麼加？
1、使用border屬性，一次設定四個邊框的樣式
border：在一個宣告中設定所有的邊框屬性。
可設定的邊框屬性：
border-width：指定邊框寬度
border-style：指定邊框樣式
border-color：指定邊框顏色
範例：設定四個邊框樣式
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
p
{
border:5px solid red;
}
</style>
</head>
<body>
<p>段落中的一些文本。</p>
</body>
</html>效果圖：
#2、使用border-bottom、border-left、 border-right、border-top分別設定四個邊框的樣式
border-bottom：在一個宣告中設定所有的下邊框屬性。
border-left：在一個宣告中設定所有的左邊框屬性。
border-right：在一個宣告中設定所有的右邊框屬性。
border-top：在一個宣告中設定所有的上邊框屬性。
範例：
<!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<style>
p
{
border-bottom:thick dotted #ff0000;
border-left:thick solid #ff0000;
border-top:thick dashed #ff0000;
border-right:thick double #ff0000;
}
</style>
</head>
<body>
<p>段落中的一些文本。</p>
</body>
</html>效果圖：
以上是邊框css四邊怎麼加的詳細內容。更多資訊請關注PHP中文網其他相關文章！
陳述：
本文內容由網友自願投稿，版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容，請聯絡admin@php.cn