小编给大家分享一下css如何去掉border的底部,希望大家阅读完这篇文章后大所收获,下面让我们一起去探讨吧!
创新互联是一家以成都网站建设、网页设计、品牌设计、软件运维、成都网站营销、小程序App开发等移动开发为一体互联网公司。已累计为玻璃钢雕塑等众行业中小客户提供优质的互联网建站和软件开发服务。在css中,可以使用border-bottom或border-bottom-style属性,设置“border-bottom:none;”或“border-bottom-style:none;”样式来去掉border的底部边框。
border-bottom-style属性可以设置元素底部边框样式,当属性值设置为“none”时,可以指定无边框。
而border-bottom缩写属性设置一个声明中所有底部边框属性。包括:
border-bottom-width 指定底部边框宽度
border-bottom-style 指定底部边框样式
border-bottom-color 指定底部边框颜色
示例:去掉border的底部边框
HTML代码:
有底边界。
无底边界。
点底边界。
虚线底边界。
实线底边界。
双线底边界。
凹槽底边界。
垄状底边界。
嵌入底边界。
外凸底边界。
css代码:
p {border-style:solid;} p.none {border-bottom-style:none;} p.dotted {border-bottom-style:dotted;} p.dashed {border-bottom-style:dashed;} p.solid {border-bottom-style:solid;} p.double {border-bottom-style:double;} p.groove {border-bottom-style:groove;} p.ridge {border-bottom-style:ridge;} p.inset {border-bottom-style:inset;} p.outset {border-bottom-style:outset;}
效果图:
p { border-style:solid; border-bottom:thick dotted; } p {border-style:solid;} p.none {border-bottom:none;} p.dotted {border-bottom:thick dotted #ff0000;} p.dashed {border-bottom:dashed #ff0000;} p.solid {border-bottom:solid #ff0000;} p.double {border-bottom:double #ff0000;} p.groove {border-bottom:groove #ff0000;} p.ridge {border-bottom:ridge #ff0000;} p.inset {border-bottom:inset #ff0000;} p.outset {border-bottom:outset #ff0000;}
效果图:
看完了这篇文章,相信你对css如何去掉border的底部有了一定的了解,想了解更多相关知识,欢迎关注创新互联行业资讯频道,感谢各位的阅读!