如何缩短底边的长度？在html/css

我有一个div容器（bootstrap.min.css的东西）。而div有另一个名为divborder的类。边界的边界很长，我怎么能削减它？或者可能缩短它的长度？示例代码：如何缩短底边的长度？在html/css

.divborder { 
 
    border-bottom: 6px solid #C6C4C5; 
 
    /*what should i put here to shorten this border-bottom?*/ 
 
}

<div class="container divborder"> 
 
    <div class="col-md-6"> 
 
    some img 
 
    </div> 
 
    <div class="col-md-6"> 
 
    some texts 
 
    </div> 
 
</div>

来源

2017-10-16 benok

可能是更好的提供预期最终结果的一个例子，我不认为你已经充分掌握CSS边界的概念，但他们如何适用，所以他们可能*不是你正在寻找的解决方案*。 – UncaughtTypeError

我不能在这里张贴图片，因为我是一个新手:(但这里是链接的例子：https：//i.stack.imgur.com/zs81n.jpg 这里的边界底部显示更短，如何做到这一点？ – benok

这可能不是一个边界属性，更可能是一个'伪元素' - Paulie_D应该让你的答案覆盖。 – UncaughtTypeError

你不能改变边界的实际长度。

你需要使用定位的伪元素。

div { 
 
    width: 100px; 
 
    height: 100px; 
 
    background: rebeccapurple; 
 
    margin: 1em auto; 
 
    position: relative; 
 
} 
 

 
div::after { 
 
    content: ""; 
 
    position: absolute; 
 
    height: 10px; 
 
    background: red; 
 
    top: 100%; 
 
    width: 50%; 
 
    left: 50%; 
 
    transform: translateX(-50%); 
 
}

<div></div>

来源

2017-10-16 14:18:57

如何缩短底边的长度？在html/css

回答

相关问题