Css 顶部(右上方)引导边框底部边框
我怎样才能把边界放在边界之上?标题的一部分是横幅,另一部分是底部边框与横幅混合的文本。有一种不同的颜色,我想在我创建的边框顶部画一条1px的实线。有可能在边界上加一个边界吗Css 顶部(右上方)引导边框底部边框,css,twitter-bootstrap-3,Css,Twitter Bootstrap 3,我怎样才能把边界放在边界之上?标题的一部分是横幅,另一部分是底部边框与横幅混合的文本。有一种不同的颜色,我想在我创建的边框顶部画一条1px的实线。有可能在边界上加一个边界吗 <div class="navbar navbar-default mega-menu" role="navigation"> <div class="container"> <!-- Brand and toggle ge
<div class="navbar navbar-default mega-menu" role="navigation">
<div class="container">
<!-- Brand and toggle get grouped for better mobile display -->
<div class="navbar-header">
<div class="row">
<div class="col-md-10">
<a href="#"><img id="logo-header" class="header-banner img-responsive" src="assets/img/ptaximg/topgraphicptax.jpg" width="1000" alt=""></a>
</div>
<div id="border" class="col-md-2">
<!--<a class="navbar-brand" href="index.html">
<img src="assets/img/ptaximg/ptax-logo_sm.jpg" alt="Logo">-->
<a class="navbar-brand" href="http://www.pacificbluesoftware.com/">
<img src="assets/img/ptaximg/ptax-logo_sm.jpg">
<p class="powered_by text-center">Powered by</p>
<p class="powered_by text-center"><strong>Pacific Blue Software, Inc.</strong></p>
</a>
</div>
</div>
<button type="button" class="navbar-toggle" data-toggle="collapse" data-target=".navbar-responsive-collapse">
<span class="full-width-menu">Menu Bar</span>
<span class="icon-toggle">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</span>
</button>
</div>
</div>
#border{
border-bottom: solid 27px #296488;
margin-left: -15px;
}
使用:after和:before类尝试此操作:
#边框{
位置:相对位置;
边框底部:实心20px#296488;
左边距:-15px;
}
#边界:之前{
内容:“;
位置:绝对位置;
z指数:-1;
顶部:0px;
左:0px;
右:0px;
底部:-22px;
边框底部:10px实心#ffea00;
}
使用:after和:before类尝试此操作:
#边框{
位置:相对位置;
边框底部:实心20px#296488;
左边距:-15px;
}
#边界:之前{
内容:“;
位置:绝对位置;
z指数:-1;
顶部:0px;
左:0px;
右:0px;
底部:-22px;
边框底部:10px实心#ffea00;
}
您可以使用box shadow
创建双边框,如下所示:
#border{
border-bottom: solid 27px #296488;
box-shadow: inset 0 -10px 1px -10px red;
}
您可以使用box shadow
创建双边框,如下所示:
#border{
border-bottom: solid 27px #296488;
box-shadow: inset 0 -10px 1px -10px red;
}