边框样式
边框样式采用border-style来设置,可以简写为border
常用样式
- none: 默认无边框
- dotted: 定义一个点线边框
- dashed: 定义一个虚线边框
- solid: 定义实线边框
- double: 定义两个边框。 两个边框的宽度和 border-width 的值相同
- groove: 定义3D沟槽边框。效果取决于边框的颜色值
- ridge: 定义3D脊边框。效果取决于边框的颜色值
- inset:定义一个3D的嵌入边框。效果取决于边框的颜色值
- outset: 定义一个3D突出边框。 效果取决于边框的颜色值
附加
border也可以针对某个部分进行添加边框
例如:border-top是针对于顶部添加边框
完整案例:
需求:为一个盒子创建一个顶部的白色实线边框
完整代码为
<style>
.box{
border:1px solid white;
}
</style>
<div class="box"></div>
上面创建了一个盒子,class属性为box。首先写入边框border后面跟着的1px为1像素的边框 后面的solid为实线,white为边框的颜色
html中hr也标签也可以实现实现属性(现在大部分采用border的方式写边框)
文章版权声明
1
本网站名称:吾唯一
2
本站永久网址:https://www.5v1.com
本站代码模板仅供学习交流使用请勿商业运营,严禁从事违法,侵权等任何非法活动,否则后果自负!
© 版权声明
文章版权归作者所有,未经允许请勿转载。
THE END
暂无评论内容