html - 在我的画廊 div 中定义图像样式的正确方法是什么？

Question

我有一个 id 为“gallery”的 div，我想为其中的图像设置样式。具体来说，我想给每个图像一个 1px 的纯黄色边框，除了底部，因为它们彼此重叠，所以我不想将底部的边框加倍。

我感到困惑的是如何在不同的边框样式元素之间进行选择：边框、边框样式、边框宽度。我试过这个：

div#gallery img
{
    border-width:1px;
    border-style:solid;
    border: solid yellow;
    border: 1px 1px 0px 1px;
}

我设法用上面的这个 css 得到了一个黄色边框，但边框看起来更像是一个 2px 的边框——它很厚——而且，除此之外，我使用的语法看起来不是很优雅。

关于如何更简洁/优雅地做到这一点的任何建议？

score 3 · Accepted Answer

我认为这是最好的方法：

border: 1px solid yellow;
border-bottom: none;

border声明的语法会width style color影响所有四个边界。之后，您可以通过声明border-bottom为 none 来覆盖底部以使用无边框。

score 0 · Accepted Answer

我真的不知道是否有错误的方法，但您基本上有 3 种方法可以做到：

方法一

border-top: 1px solid yellow;
border-right: 1px solid yellow;
border-left: 1px solid yellow;

方法二

border: 1px solid yellow;
border-bottom: 0;

方法二

border: 1px solid yellow;
border-bottom: none;

我更喜欢方法2或方法3。

（我知道方法2和方法3基本相同，但我想给出两种解决方案，所以你可以选择你喜欢的，“无”或“0”）。

2 回答 2