1

有时我发现自己处于想要为border元素的左侧和右侧定义规则的情况。但老实说,border-left: solid 1px #999; border-right: solid 1px #999有点笨拙。它浪费空间,我必须两次应用更改,它可能会或可能不会降低效率。

有没有办法一次性定义水平边框或垂直边框?

4

4 回答 4

6
<div id="myDiv">Your Div</div>

CSS:

#myDiv
{
border-width:0 1px 0 1px;
border-color:#ddd;
}
于 2012-09-13T12:59:49.280 回答
3

您可以像这样一次性完成:

#myDiv
{
    width: 100px;
    height: 100px;
    border: 1px solid #999;
    border-width: 0 1px; /*horizontal, vertical*/
}​​​​​​

http://jsfiddle.net/52AEP/

于 2012-09-13T13:07:23.993 回答
0

不。

来自https://developer.mozilla.org/en-US/docs/CSS/border

虽然border-width、border-style和border-color属性,甚至margin和padding的简写属性最多接受四个值,允许为不同的边框设置不同的宽度、样式或颜色,但该属性只接受一个值对于每个属性,导致四个边缘的边界相同。

因此,您可以切换到使用单独的边框宽度、边框样式和边框颜色属性,使用它们的简写属性来设置每边样式 - 但我认为您最好还是拥有它。

也就是说,确保将样式定义保存为 CSS 类 - 然后可以跨元素重复使用,而不是在整个页面的元素上逐一应用这些“样式”属性。

于 2012-09-13T12:59:16.427 回答
-2

不幸的是,css 中没有选项......您必须手动编写所有边框参数。

于 2012-09-13T12:59:33.697 回答