Css 第n个子元素第一个和最后一个都应用于元素
我正在尝试为以下标记编写选择器:Css 第n个子元素第一个和最后一个都应用于元素,css,css-selectors,Css,Css Selectors,我正在尝试为以下标记编写选择器: <div class="row"> <a href="#"> <div class="one-third column">content</div> </a> <a href="#"> <div class="one-third column">content</div> </a> &
<div class="row">
<a href="#">
<div class="one-third column">content</div>
</a>
<a href="#">
<div class="one-third column">content</div>
</a>
<a href="#">
<div class="one-third column">content</div>
</a>
</div>
但是,这将导致上述两个选择器应用于每三分之一的元素。我试图在不向第一个和最后一个元素添加类的情况下实现这一点。非常感谢您的帮助。这可以完成,但是您需要选择链接的第一个子项和最后一个子项。如果要进入链接内部并选择只有一个元素的元素的第一个子元素和最后一个子元素,则所需的样式将无法工作。如果选择标记的第一个和最后一个,将获得所需的结果: a排:第一个孩子,三分之一{ 左侧填充:0; } a排:最后一个孩子。三分之一{ 右边填充:0; }
您可以使用css的第n个childn选择器 .a行:第n-child1行{ 左侧填充:0; } .a行:第N-child3行{ 左侧填充:0; }
好极了-这很好用。当足够的时间过去后,我会接受这个答案。太好了,很高兴听到
.row a > .one-third:first-child {
padding-left: 0;
}
.row a > .one-third:last-child {
padding-right: 0;
}