边框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中文网其它相关文章！

「如果文章对您有用，欢迎点赞分享。」

1.文章版权归作者所有，可以不经允许任意转载。 2.如有侵权请告知，我会第一时间删除。

THE END