Question

我正在使用下面显示的CSS来创建一个正确对齐的表单，而不使用表格。唯一的问题是其中一个字段有多个“选项”，应该在它旁边显示。我可以将哪种样式附加到特定字段旁边的项目，以确保它们不显示为“内联块”？

label {
    display: inline-block;
    float: left;
    clear: left;
    width: 180px;
    text-align: right;
    padding-right: 5px;
}

input {
    display: inline-block;
    float: left;
    width: 165px;
    margin-bottom: 2px;
}

Answer 1

确切地知道你在问什么...也许就是这样？

如果要覆盖特定元素的CSS样式，可以使用 !important 声明。

示例：

li {
    background-color: #000;
}

/*A specific list to have a white background*/

.specific {
    background-color: #fff !important;
}

!important标记将覆盖所有其他样式/继承。 http://css-tricks.com/when-using-important-is-the-right-choice/

Answer 2

为项目提供ID。

Ids优先于一般元素或类语句，因为它们更具体。例如，您可以使用id="myItems"将项目包装在div中，然后在上述规则之后添加以下css规则：

input#myItems {
  display: block;
}

覆盖表单布局的CSS类

2 个答案: