Question

如何在我的CSS文件类中识别id。

所以在我的html文件中，我创建了一个基本的标签和文本框。

<div id="User">
    <div>
        <div class="left">
            <asp:Label ID="Label1" runat="server" Text="User Name"></asp:Label>
        </div>
        <div class="right">
            <asp:TextBox ID="TextBox1" runat="server"></asp:TextBox>
        </div>
    </div>
</div>

但是如何在我的CSS文件中左右访问类，这就是我所拥有的。

#User
{
    .left {
        width: 30%;
        float: left;
        text-align: right;
    }
    .right {
        width: 65%;
        margin-left: 10px;
        float:left;
    }
}

Answer 1

不要像这样嵌套你的选择器。这应该工作

#User .left {
  width: 30%;
  float: left;
  text-align: right;
}
#User .right {
  width: 65%;
  margin-left: 10px;
  float:left;
}

Answer 2

您不需要#User部分。以下就足够了

.left 
{
 width: 30%;
 float: left;
 text-align: right;
}

.right 
{
 width: 65%;
 margin-left: 10px;
 float:left;
}

你要添加#User部分的唯一原因是区分可能具有.left和.right等级的其他div，例如，如果你想这样做那么你会去

#User .left {  background-color: blue; }
#User .right { /** CSS Code in here **/ }

<div id="User">
    <div class="left">Testing Left</div>
    <div class="right">Testing Right</div>
</div>
<br />
<br />
<div id="User2">
    <div class="left">Testing Left2</div>
    <div class="right">Testing Right2</div>
</div>

在这种情况下，只有第一个.left会有蓝色背景。

Answer 3

#user.left and #user.right

应该有效。你也可以用像td.left这样的标签做同样的事情，只会将类左对齐td元素。

编辑：是的，不要像MVCKarl那样嵌套

在ID中指定类Css

3 个答案: