有没有办法限制边界的长度?我有一个有底部边框的<div>,但我想在<div>的左边添加一个只延伸一半的边框。

有没有什么方法可以在不添加额外元素的情况下做到这一点?


当前回答

边界只能按边来定义,而不能按边的分数来定义。所以,不,你不能这样做。

另外,一个新元素也不会是边界,它只会模仿你想要的行为-但它仍然是一个元素。

其他回答

另一种解决方案是使用背景图像来模拟左侧边框的外观

创建所需的左边框样式作为图形 将其放置在div的最左边(使其足够长,以处理旧浏览器中大约两次文本大小的增加) 设置垂直位置的50%从你的div顶部。

你可能需要为IE做一些调整(像往常一样),但如果这是你想要的设计,那么值得一试。

我通常反对使用CSS固有的图像,但有时如果设计需要它,没有其他的方法。

每条边只能定义一个边框。您必须为此添加一个额外的元素!

边界只能按边来定义,而不能按边的分数来定义。所以,不,你不能这样做。

另外,一个新元素也不会是边界,它只会模仿你想要的行为-但它仍然是一个元素。

# mainDiv { 身高:100 px; 宽度:80 px; 位置:相对; Border-bottom: 2px solid #f51c40; 背景:# 3 beadc; } # borderLeft { Border-left: 2px solid #f51c40; 位置:绝对的; 上图:50%; 底部:0; } < div id = " mainDiv " > < div id = " borderLeft " > < / div > < / div >

对于水平线,你可以使用hr标签:

hr { width: 90%; }

但是限制边界高度是不可能的。只有元素高度。