想要有.list样式的最后一个不要下划线。
为什么:last-child没有起作用?

el:last-child 的匹配规则是:第一步,查找 el 选择器匹配元素的所有同级元素(siblings);第二步,在同级元素中查找最后一个元素;第三步,检验最后一个元素是否与选择器 el 匹配。

.list:last-child 匹配到了 footer,但 footer 不匹配 .list,故选择器不生效。

1.可改成.list:nth-last-child(2)

2. 把所有.list标签用div包起来,保证最后一个子元素为.list

3.div .list:first-of-type{font-weight:blod}

这时候调试下就没问题了。
这里我们要理解下:first-child和:first-of-type 区别:
:first-child  指的是父元素的第一个子元素,例如我们本例子中要使用first-child实现的话,必须把h1标签去掉保证没有兄弟元素,或者单独把P标签包围起来;

:first-of-type 指的是父元素下相同类型子元素中的第一个,比如我们例子中的第一个p标签。

为什么选择器:last-child有时没有起作用?的更多相关文章

  1. html学习第二天—— 第八章—— CSS选择器

    标签选择器其实就是html代码中的标签.如右侧代码编辑器中的<html>.<body>.<h1>.<p>.<img>.例如下面代码:p{fo ...

  2. CSS 后代选择器

    后代选择器(descendant selector)又称为包含选择器. 后代选择器可以选择作为某元素后代的元素. 根据上下文选择元素 我们可以定义后代选择器来创建一些规则,使这些规则在某些文档结构中起 ...

  3. 对jQuery选择器的总结

    jQuery基础选择器 $("div*")获取div下面的所有元素 $(".red,.green").html("怎么") // 需要注意的 ...

  4. HTML 学习笔记 CSS(选择器4)

    CSS 后代选择器 后代选择器(descendant selector)又称为包含选择器.后代选择器可以选择作为某元素后代的元素. 根据上下文选择元素 我们可以定义后代选择器来创建一些规则,使这些规则 ...

  5. 【转载】Sencha Touch 提高篇 组件选择器

    免责声明:     本文转自网络文章,转载此文章仅为个人收藏,分享知识,如有侵权,请联系博主进行删除.     原文作者:威老     原文地址:http://www.cnblogs.com/weil ...

  6. HTML+CSS学习笔记(8)- CSS选择器

    标签:HTML+CSS 什么是选择器? 每一条css样式声明(定义)由两部分组成,形式如下: 选择器{ 样式; } 在{}之前的部分就是"选择器","选择器"指 ...

  7. CSS 中常用的选择器(选择符)

    一.标签选择器:直接将HTML标签(Tag)作为选择器,可以是p.h1.dl.strong等HTML标签.如: p { font:12px;}em { color:blue;}dl { float:l ...

  8. CSS基础知识笔记(二)之选择器

    CSS选择器 选择器{ 样式; } 每一条css样式声明(定义)由两部分组成,形式如下: 在{}之前的部分就是“选择器”,“选择器”指明了{}中的“样式”的作用对象,也就是“样式”作用于网页中的哪些元 ...

  9. CSS选择器之基本选择器总结

    一.元素选择器(所有浏览器支持) 元素选择器(标签名选择器)其实就是文档的元素,如html,body,p,div等等, 下面例子中选择了span元素,并设置了字体颜色为红色. <body> ...

  10. 从零开始学习html(八)CSS选择器——下

    六.子选择器 <!DOCTYPE HTML> <html> <head> <meta http-equiv="Content-Type" ...

随机推荐

  1. mysql使用命令行执行存储过程

    编写存储过程sql 以给brand表添加phone字段为例: DROP PROCEDURE IF EXISTS UpdateColum; CREATE PROCEDURE UpdateColum() ...

  2. oc 基本语法 类 静态变量 常量

    // // ReViewClass.h // hellowWorld // 本类是oc复习练手类 // Created by hongtao on 2018/3/26. // Copyright © ...

  3. 取得远端相应Json并转化为Java对象(嵌套对象)二

    工程下载链接:https://files.cnblogs.com/files/xiandedanteng/JsonParse20190929.rar 客户端: 如果从Restful Service取得 ...

  4. Java爬虫爬取京东商品信息

    以下内容转载于<https://www.cnblogs.com/zhuangbiing/p/9194994.html>,在此仅供学习借鉴只用. Maven地址 <dependency ...

  5. Docker在CentOS下的安装

    工欲善其事,必先利其器. 在我们以后的Docker学习中,都推荐使用CentOS6.5作为学习平台,毕竟Docker的内核也是基于Linux的.本文主要分享笔者在CentOS下的安装Docker的过程 ...

  6. JavaScript数值千分位格式化的方法和性能

    瞎掰的前提 前端嘛,经常处理数值和时间. 所以数值和时间的格式化少不了. 最近一直在面试前端, 就出了一个如何给数值添加千分位的面试题. 至于答案,我一直都有一种标准, 一是基于你现有的知识可以实现, ...

  7. HTML中Data的数据类型

    "data"类型的Url格式,是在RFC2397中提出的,目的对于一些“小”的数据,可以在网页中直接嵌入,而不是从外部文件载入. 例如对于img这个Tag,哪怕这个图片非常非常的小 ...

  8. v8 google 下载及编译

    ubuntu环境下进行 参考文档: http://code.google.com/p/v8/wiki/BuildingWithGYP (一) 源码下载及编译 1, Google v8 官网:http: ...

  9. DNS_主从搭建

    一.DNS简介 1.DNS DNS是域名系统(Domain Name System)的简称,它是一个将域名和IP相互映射的分布式数据库.有了DNS服务器,我们只需要记录一个网站的域名即可访问,而再也不 ...

  10. Linux高级命令进阶(week1_day2)

    Linux高级命令进阶(week1_day2)--技术流ken   输出重定向   场景:一般命令的输出都会显示在终端中,有些时候需要将一些命令的执行结果想要保存到文件中进行后续的分析/统计,则这时候 ...