html - 如何基于是否显示父div创建CSS规则:无

我想基于设置为display：none的父元素通过CSS更改样式设置。

这是HTML：

<div id="mapLinkDiv" class="nav nav-second-level">
  <table class="NavSurvey" style="width:180px;">
    <tbody>
      <tr>
        <td>
          <a class="fixedResultsLink" href="/QBMapping/QBMap.aspx" title="Map results by State" target="MapByState">Map by State</a>
        </td>
      </tr>
    </tbody>
  </table>
  <table class="NavSurvey" style="width: 180px; margin-top:10px;">
    <tbody>
      <tr>
        <td style="font-size:12px; text-align:center;">Maps are underdevelopment and may not work properly</td>
      </tr>
    </tbody>
  </table>
</div>

所以我想建立一条规则，说如果mapLinkDiv是display：none，则从所有标记中删除带有类'fixedResultsLink'的padding-left

这是我目前的CSS（在页面上）：

<style>
  a.fixedResultsLink{
    padding-left:28px;
  }
  #mapLinkDiv[style*='display:none'] a.fixedResultsLink {
    padding-left:0;
  }
</style>

到目前为止，我发现没有什么可以帮助我解决这个问题，但是在Google中输入了错误的标准：）

为了清楚起见，这是我正在研究的第二条CSS规则。

我该如何实现？

最佳答案

#mapLinkDiv [style * ='display：none'] a.fixedResultsLink正在选择具有直接后代a.fixedResultsLink的#mapLinkDiv。最简单的方法是将a.fixedResultsLink的所有父标记插入css选择器中，尽管很麻烦。

#mapLinkDiv [style * ='display：none']表格tbody tr td a.fixedResultsLink