时间:2019-09-18 13:29:49 作者:无名 浏览量:63
section:nth-child(1) {} /* 选择第一个
article:nth-child(1) {} /* 选择第一个
section:nth-child(2) {} /* 选择第二个
article:nth-child(2) {} /* 选择第二个
同样,我们可以使用“:nth-last-child”选择器定位反序的一些元素。
section:nth-last-child(1) {} /* 选择最后一个
article:nth-last-child(1) {} /* 选择最后一个
section:nth-last-child(2) {} /* 选择倒数第二个
article:nth-last-child(2) {} /* 选择倒数第二个
使用更多的方式选择指定元素
另一种选择HTML5中指定元素(如header、section和footer)的方法就是利用”:only-of-type”选择器的优势。由于这些HTML5元素通常会在很多地方出现不止一次,所以当我们想定位那种在父元素下仅出现过一次的标签时这种方法很方便。例如,我们要选择的是在某
元素中有切仅有的唯一一个元素,如以下代码:
[button value=\\\\\\\"复制代码\\\\\\\"]
我们可以仅使用以下一行选择器:
section>section:only-of-type {}
再次唠叨,你可以固执的为每个元素添加ID属性,但你会失去代码的可扩展性、维护性和绝对简洁的结构与表现相分离。CSS3的确能让我们可快速更方便的定位几乎所有没有ID和class属性的页面元素。
总结
我相信随着时间的推进和更多浏览器的支持,HTML5和CSS3将越来越受欢迎,它们将为web设计师们带来更无穷的能量,让我们的web前端更上一个台阶。