2回答

• 

  曦雨微尘

  2017-03-01 15:20:55

  已采纳

  1. 第一个问题说明你还没弄懂什么是CSS选择器，.slider li:nth-of-type(1) a 这句话的意思是：先确定class名为slide的元素,然后确定这个元素内的第一个标签为<li>的子元素，最后确定这个li里面的a元素，“所以这个CSS选择器的最终目标是a而不是li”。

  2. 第二个问题，你可以回过头去看看各个元素的css相关设置。你会发现li设置的高度只有130px，a没有设置高度，而a的实际高度有154px（受浏览器影响或有差异，差异来自font-size）。那么问题来了，a的高度是怎么来的呢？首先a里面有一行文本，第1.3.4.5个a标签内显示出来都是两行，而2显示出来是三行，我就拿两行的来说吧。字号font-size:22，22号字显示出来实际高度为60px(360极速浏览器，其他浏览器可能并不是这个值，比如我用chrome看是52px)，此外a还有padding-top：70px，padding-bottom：20px，此外加上border：2px，上下各2px，就是4px，那么a的实际高度为60+70+20+4=154px，所以你对li设置背景下面有空的地方，那实际上是a撑开的高度，边框很清楚的显示了a的宽高范围，li实际上已经被填满了。

  3 1

  箫闻 回复小王白石玉

  slide下就没有li标签，应该是.clearfix下的li

  2017-05-23 19:51:54

  共 3 条回复 >

• 

  寻阡陌Dorothy

  2017-08-21 18:33:36

  请问为什么不能写成.slider li>a:nth-of-type(2)呢？ 为什么a要写在后面呢 我看了 .slider li:nth-of-type(2)>a是可以的 >省略也可以 为什么a要写在后面呢

  0 0