Html中控制边框线的长度,CSS边框长度控制

CSS边框长度控制

时间:2018-12-27 10:51 / 来源:未知 / 作者:酱油 / 点击:

次

以前需要边框长度比容器小一些时，我用div嵌套。后来发现伪类在实现这个效果时很方便，只需要一个div就够了，另外调整padding和margin都不会很麻烦。

border top

border left

border right

border bottom

CSS.box-container {

position:relative;

width:90%;

color:#777;

}

.border-top {

background:#b4bcbf;

padding:15px;

}

.border-top:before {

content:'';

position:absolute;

left:42%;

top:0;