答案 0 :(得分:1)
你需要一个有这个长度的元素。 AFAIK你不能放置与元素大小不同的长度的边框。在这里,我使用div
内的li
进行操作,因为<li>
标记的工作方式。它在子弹和内容之间以“间隙”(通常称为边距或填充)呈现。因为<div>
位于<li>
内,其宽度已经小于<li>
的宽度。
li > div {
border-top: solid 1px #ccc;
border-bottom: solid 1px #ccc;
padding: 8px 4px;
margin-bottom: -1px;
}
<ul>
<li><div>Foo 1</div></li>
<li><div>Foo 2</div></li>
</ul>
答案 1 :(得分:0)
要达到预期的效果,请使用下面的选项,使用左侧填充来实现左侧的间隙
app.post('/sc', function(req, res){
var url = req.body.convo
console.log(url)
getPic(url);
})
.parent{
padding-left:20px;
}
.child{
width:100%;
height:100px;
background:yellow;
border-bottom:1px solid black;
}
答案 2 :(得分:0)
我不确定这是否是您需要的,但您可以使用线性渐变模拟宽度为75%的边框。
.box{
width: 250px;
height: 50px;
background: #eee;
border-bottom: 5px solid transparent;
border-image: linear-gradient(to right, black 0%, black 75%, transparent 75%);
border-image-slice: 1;
}
<div class="box"></div>