由于幻灯片中有某些元素,因此我使用带有负偏移量而不是边框的轮廓。
但是,子元素覆盖了轮廓,但是我希望它们之间具有边框。我正在用它来框架内容。
http://jsfiddle.net/z22kw2zq/1/
.parent {
position:relative; outline: green 3px solid;
outline-offset:0px;
background-color:pink;
pading:5px;
overflow:hidden;
}
.child {position:relative; top:26px; background-color:yellow;
display:inline;
}
您可以将:after
伪元素用于outline和add position: absolute
。
.parent {
position: relative;
background-color: pink;
overflow: hidden;
}
.parent:after {
width: 100%;
height: 100%;
content: '';
outline: green 3px solid;
outline-offset: -3px;
position: absolute;
top: 0;
left: 0;
}
.child {
position: relative;
top: 23px;
background-color: yellow;
display: inline;
}
p {
margin: 0;
}
<div class="parent">
<div class="child">lorem ipsum doler sit amet</div>
<p>text here</p>
</div>
本文收集自互联网,转载请注明来源。
如有侵权,请联系[email protected] 删除。
我来说两句