Question

我的CSS文件中有以下代码，但无效。

#home table th td {
  border:1px solid black;
  padding:2px;
}

在我的index.haml文件中，我有：

%div{:id => "home"}
  %table
    %tr
      %th
        Your Account
    %tr
      %td
        #{link_to 'View my profile', @profile}
        %br
        #{link_to 'Edit my profile', edit_profile_path(@profile)}
        %br
        #{link_to 'Logout', :controller => 'admin', :action => 'logout'}

创建此页面源（我知道，多余。但只是为了彻底）：

<div id='home'>
  <table>
    <tr>
      <th>
        Your Account
      </th>
    </tr>
    <tr>
      <td>
        <a href="/profiles/7">View my profile</a>
        <br />
        <a href="/profiles/7/edit">Edit my profile</a>
        <br />
        <a href="/admin/logout">Logout</a>
      </td>
    </tr>
  </table>
</div>

但是当我在浏览器中查看文件时，边框不显示...

当我将表格标签分开时

#home table {
      border:1px solid black;
      padding:2px;
    }

#home th {
      border:1px solid black;
      padding:2px;
    }

#home td {
      border:1px solid black;
      padding:2px;
    }

看起来很好。

以前的CSS代码与此版本有什么不对？我该如何将这些标签正确地折叠成一个ID？

Answer 1

以下是您可以使用的问题

标题：

#home table tr th {
  border:1px solid black;
  padding:2px;
}

表格单元格：

#home table tr td {
  border:1px solid black;
  padding:2px;
}

更多详细信息请查看：http://www.w3schools.com/css/default.asp

使用Haml的CSS ID和嵌套标签

1 个答案: