如何设置引导标签的高度和边框?
我在该模态中创建了一个模态和一个导航标签。有两个问题 。
-
首先是那些标签的高度非常大,我想将它们的高度设置得稍微小一点。我试图使用css height属性设置它们的高度,但它对我不起作用。
-
我的第二个问题是,当打开特定选项卡时,显示在该选项卡底部的边框底部/线不会被隐藏,因为它应该正常。我想隐藏选项卡打开时的底线。
所以,请任何人帮我解决上述问题。
这是我的模态的图像与标签:
这是我的这些选项卡的代码 (我避免不必要的代码):
共享我的解决方案以防万一其他人必须调整高度:
.nav-tabs > li > a { /* adjust padding for height*/ padding-top: 4px; padding-bottom: 4px; }
第二个问题可以通过调整活动锚的边距来解决
.nav-tabs > li.active > a:focus, .nav-tabs > li.active > a { margin-top: 1px; } .nav-tabs > li { margin-bottom: 0px; } .nav-tabs > li.active { margin-bottom: -1px; }
对于First issue
使用height:43px
第二,你必须设置border-bottom:none
like,
CSS
li{ position:absolute; margin-left:0px; height:43px; } li.active{ border-bottom:none; }
HTML
演示
我正在拍摄@Rohan Kumar的演示。
只需更改css:您需要执行以下操作
第一个问题:您需要将border-bottom设置为以下内容背景,就像使用全边框一样
li.active { border-bottom:1px solid white; }
第二个问题:您可以通过定义高度来执行@Rohan Kumar,或者如果需要,可以将margin和padding设置为0来增加顶部和底部的填充值。
演示