【问题标题】:first-child last-child and the ones in between第一个孩子最后一个孩子和介于两者之间的孩子
【发布时间】:2013-06-25 20:51:06
【问题描述】:

好的,所以我得到了一个 PHP,它由一个依赖于手头动态情况的开关循环传播(我认为)。现在,当我添加一个复选框时,我希望能够在 div 中创建第一个复选框,该复选框具有顶部边框和侧面,没有底部。下面的只有一个边边框,最后一个有边和底部,但没有顶部。希望这是有道理的。这是我必须编辑的所有代码:

case "E":
    $str.='<div id="leftcolrightboxcheckattach"><div id="enqattachcheckcontent" ><div id="enqleftcolattachcheckbox"><input type="checkbox" id="answer_question_'.$row['ques_id'].'[]" name="answer_question_'.$row['ques_id'].'[]" value="'.$arrMul[$i]["mul_name"].'" style="border:thick solid #fff" /></div><div id="enqleftcolattachcheckboxright">'.$arrMul[$i]["mul_name"].'</div></div></div>';
    break;

这是我的 CSS。标准类有效,last-child 有效,但 first-child 无效...任何想法为什么?

#leftcolrightboxcheckattach:first-child{width:96%; margin:5px auto; clear:both; background:#000; border-top:thin solid #E6E6E6;  position:relative; }
#leftcolrightboxcheckattach{width:96%; margin:5px auto; clear:both; background:#fff; border-left:thin solid #E6E6E6; border-right:thin solid #E6E6E6; position:relative; }
#leftcolrightboxcheckattach:last-child{width:96%; margin:5px auto; clear:both; background:#fff; border-bottom:thin solid #E6E6E6; position:relative; }

【问题讨论】:

  • 因为你用中间规则覆盖了它,所以把第一个孩子放在最后一个孩子旁边。
  • 认为但没有任何区别 first-child 仍然是多余的。
  • 尝试使用更窄的选择器,例如body #leftcolrightboxcheckattach:first-child
  • 你看到这个stackoverflow.com/questions/3326480/…了吗?
  • 你能给我们你的测试HTML代码(和/或jsfiddle)

标签: php css css-selectors


【解决方案1】:
#leftcolrightboxcheckattach:not(:first-child):not(:last-child)
{

      .....
}

【讨论】:

    猜你喜欢
    • 1970-01-01
    • 2012-02-09
    • 2013-03-12
    • 2022-11-10
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 1970-01-01
    • 2013-06-06
    相关资源
    最近更新 更多