bootstrap4如何设置边框

 剑鱼论坛 发表于 2020年01月09日 CSS/CSS3  35
剑鱼论坛
LV 5 [初中]
最后在线:59分钟前
加入时间:262天前
主帖:83  跟帖:44

bootstrap4可以方便地设置一个元素的边框,我们来看一下如何设置。

假设我们有一个元素,如下:

<div>div元素</div>

现在我们希望给这个元素添加一个边框,只需要在上面的基础上添加一个样式就可以了,如下:

<div class="border">div元素</div>

很简单,就是增加了代码“ class="border"”,现在您查看这个元素的时候就能够看到边框了。

如果某个元素我们希望去掉边框,那么可以用下面的代码实现:

<div class="border-0">div元素</div>

“border-0”的意思就是边框为0的意思,是不是很容易看明白。

进一步,如果我们要设置局部边框的话,那么可以用如下代码:

border-top:显示顶部边框

border-right:显示右侧边框

border-bottom:显示底部边框

border-left:显示左侧边框

对应地,假设我只需要某个边不显示的话,那么可以用如下的代码:

border-top-0:不显示顶部边框

border-right-0:不显示右侧边框

border-bottom-0:不显示底部边框

border-left-0:不显示左侧边框

代码都是比较直观的,使用很方便,bootstrap4的边框设置就介绍到这里了,希望对您有帮助。

论坛主帖
145
论坛跟帖
110
在线访客
2
今日主帖
0
今日跟帖
0
今日注册
0
72
http://jianyuluntan.com/gentie.html
http://jianyuluntan.com/postzan.html
http://jianyuluntan.com/postcai.html
http://jianyuluntan.com/postshoucang.html
http://jianyuluntan.com/gentiezan.html
http://jianyuluntan.com/gentiecai.html
http://jianyuluntan.com/huifu.html
http://jianyuluntan.com/xiugai.html
http://jianyuluntan.com/shanchugentie.html
1
XzA=
1
© 2019 - 2020 剑鱼论坛 版权所有
Powered by JianYuLunTan
剑鱼论坛 976666861
http://jianyuluntan.com/feedback.html
http://jianyuluntan.com/qiandao.html
http://jianyuluntan.com/denglu.html
0
http://jianyuluntan.com/adenglu.html