CSS - 边框只有一半的边框可见 [英] CSS - Border where only half of a border is visible

问题描述

我很困惑，因为必须使它的工作在CSS只有一个div，边框将只有一半的宽度可见。

I am confused as to have to make it work in CSS only to have a div where the border would be only visible on half it's width.

边框样式是一个简单的 1px solid＃000;

The border style is a simple 1px solid #000;

但是，我想要 div 的边框不可见（在 div 的宽度上为100％），
而不是第一个 div 的宽度的50％。

However, I want the top of the div's border to not be visible everywhere (on 100% on the div's width), rather only on the first 50% of the div's width.

我无法获得这个例子，它需要以百分比，所以通常的一袋窍门（形象在下半年，...）。

I haven't been able to get an example of this anywhere, and it needs to be in percentages, so the usual bag of tricks (image over the second half,...).

推荐答案

p>会这样工作：

#holder {
        border: 1px solid #000;
        height: 200px;
        width: 200px;
        position:relative;
        margin:10px;
} 
#mask {
        position: absolute;
        top:-1px;
        left:1px;
        width:50%;
        height: 1px;
        background-color:#fff;
}

<div id="holder">
        <div id="mask"></div>
</div>

    

这篇关于CSS - 边框只有一半的边框可见的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！