CSS选择器问题

-4

类内部，伪选择器不起作用。CSS选择器问题

 <div class="lists"> 

     <ul style="text-align:right"> 

     <li> 
     <a href="#1"> 
     HOME 
     </a> 
     </li> 

     <li> 
     <a href="#2"> 
     ABOUT US 
     </a> 
     </li> 

     <li><a href="#3"> 
     SOLUTIONS</a> 
     </li> 

     <li><a href="#5"> 
     CONTACT</a> 
     </li> 

     </ul> 

     </div> 
     </div></head> 

    <body style="margin:auto;-webkit-font-smoothing:antialiased;-webkit-text-size-adjust: 100%;"> 
     <center> 

     <!-- NEW CONTAINER --> 
     <div class="second_c"> 
     <div class="bg_box"> 
     <h3>OPTIMIZING LEARNING EXPERIENCE</h3> 
     <p style="text-align:center">NAME 
     </p></div> 
     </div> 

     <div class="present"> 
      <h2 class="team_box">TEAM</h2> 
      <p> 
      Our team  
      </p> 
     </div> 

     <div class="team_member" > 
      <ul> 
      <li>Team Member 1</li> 
      <li>Team Member 2</li> 
      </ul> 

      <ul> 
      <li>Team Member 3</li> 
      <li>Team Member 4</li> 
      </ul> 
     </div> 

      <div class="present" > 
       <h2 class="team_box" id="2">SOLUTIONS</h2> 
        <div class="grey_box"><p><br>SMART GYAN</p></div> 
        <div class="grey_box"><p>ENTRANCE <br>SOLUTIONS</p></div> 
        <div class="grey_box"><p>DIGI <br> SOLUTIONS</p></div> 
      </div> 
     </center>

我要选择单独的H2，

CSS：

.present:first-child h2 
{ 
    margin-right: 600px; 
    margin-left: 600px; 
} 

.present:.present:not(:first-child) h2 
{ 
    margin-right: 500px; 
    margin-left: 500px; 
}

就像我想给第一H2，不同的属性，另一种不同的试过的答案，但没有工作。

来源

2014-06-10 Chetan

你使用了什么选择器？你可以使用.present：最后一个孩子吗？ – joshhunt

*什么*不起作用？唯一比描述“不工作”更糟糕的是，甚至没有表明它不起作用。 – BoltClock

“.present：last-child”正在工作，但不是“.present：first-child” – Chetan

可以使用第n个孩子（）财产在你的CSS。第一索引为1

这将只适用于第一DIV.present（父容器内）：

DIV.present:nth-child(1) H2.team_box 
{ 
    ... your style ... 
}

这将仅适用于第二DIV.present（父容器内）：

DIV.present:nth-child(2) H2.team_box 
{ 
    ... your style ... 
}

来源

2014-06-10 03:32:41 hbCyber

谢谢，但我最终使用这样的： .present：第n个孩子（2）h2.team_box { \t保证金右：600px的; \t margin-left：600px; } .present：n-child（4）h2.team_box { \t margin-right：500px; \t margin-left：500px; } – Chetan

-2

 your study click webaddress 

    http://www.w3.org/TR/CSS2/selector.html#pattern-matching 
    http://www.w3.org/TR/css3-selectors/#selectors

来源

2014-06-10 03:29:35 Kisspa

http://www.w3.org/TR/CSS2/selector.html#pattern-matching http：// www .w3.org/TR/CSS3选择器/＃选择 – Kisspa

您也可以使用H2标签内的多个类，如果你想要一个更加语义的方式

<div class="present"> 
     <h2 class="team_box team_box_first">TEAM</h2> 
     <p>Our team</p> 
    </div>

来源

2014-06-10 03:34:29 jdwallace12

首先我对不好的英语感到抱歉。

<div class="present"> 
    <h2 class="team_box">TEAM1</h2> 
    <h2 class="team_box">TEAM2</h2> 
</div> 

<div class="present"> 
    <h2 class="team_box">TEAM3</h2> 
</div>

当您使用下面的代码

：

.present H2.team_box:nth-child(1) 
{ 
    color:green; 
} 

.present H2.team_box:nth-child(2) 
{ 
    color:red; 
}

的H2色彩搭配TEAM1的价值和TEAM3是绿色的。因为nth-child（1）是每个div中第一个具有相同类名称的项目，而不是代码中的第一个H2。

值为TEAM2的H2颜色为红色。

来源

2014-06-10 04:45:50 hossein

CSS选择器问题

回答

相关问题