题
我正在尝试尝试以下内容。我有一个典型的框,一个带有大边界冲程的盒子。这是我一直在玩的代码。
.insta{
background:#000;
width:820px;
height:300px;
margin-left: auto;
margin-right: auto;
}
.inner-line{
border:10px solid #fff;
width:88%;
height:300px;
position:relative;
right:20;
left:20;
top:20;
bottom:20;
}
<div class="insta"><div class="inner-line"></div></div>
.
,我得到这个结果,
我试图将此作为最终结果,
我知道盒子方法css提供,但不知道我是否可以使用它来实现这一点。任何想法或想法?
解决方案
您可以使用不使用扩展或模糊和边框的框阴影的组合:
css
border: 10px solid white;
-webkit-box-shadow: 0px 0px 0px 10px rgba(0,0,0,1);
-moz-box-shadow: 0px 0px 0px 10px rgba(0,0,0,1);
box-shadow: 0px 0px 0px 10px rgba(0,0,0,1);
.
其他提示
I know this question is very old, but you can use outline offset: http://www.w3schools.com/cssref/tryit.asp?filename=trycss3_outline-offset
Just change the offset to a negative in order to get it inside the container:
outline-offset: -15px;
不隶属于 StackOverflow