css基础day02

一、CSS复合选择器

1、标签指定选择器: h1.demo { color: red; }; h1#des { color: red; };

2、后代选择器: .box li p{}    box类下的所有li标签下的p标签;

3、并集选择器:.class,h3{} 中间用逗号隔开

4、子代选择器: h1 > strong {color:red;}

解读为:选择器h1 > strong可以解释为“选择作为h1元素子元素的所有strong元素”。

建议:尖括号与选择器之间有空格。

5、属性选择器:[ ]是标志

h1[id]{} 拥有id属性的标签;

h1[id][class]{} 拥有id和class属性的标签

input[type="text"]{} 

二、伪类选择器

:link: 伪类将应用于未被访问过的链接。IE6不兼容,解决此问题,直接使用a标签

:visited:伪类将应用于已经被访问过的链接

:hover:伪类将应用于有鼠标指针悬停于其上的元素。在IE6只能应用于a连接,IE7+所有元素都兼容

:active:伪类将应用于被激活的元素,如被点击的链接、被按下的按钮等

:focus:伪类将应用于拥有键盘输入焦点的元素

三、CSS的层叠性和继承性

层叠性:层叠性是指多种CSS样式的叠加;

继承性:子标记会继承父标记的某些样式。

注意:适当的利用继承性可以简化代码.

所有字相关的都可以继承,比如:color、text-系列、font-系列、line-系列、cursor

并不是所有的CSS属性都可以继承,例如,下面的属性就不具有继承性:边框、外边距、内边距、背景、定位、元素宽高属性。

所有盒子相关的属性都不能继承。

四、优先级

行内样式的优先级最高,其次是内嵌样式的,ID选择器对应的样式优先级最高。其次是Class样式再次是标签选择器样式,再次是通配符选择器设置的样式后面是 继承的样式,最后是浏览器默认的样式。

!important被赋予最大的优先级.

最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • CSS基础 本文包括CSS基础知识选择器(重要!!!)继承、特殊性、层叠、重要性CSS格式化排版单位和值盒模型浮动...
    廖少少阅读 3,253评论 0 40
  • 问答题47 /72 常见浏览器兼容性问题与解决方案? 参考答案 (1)浏览器兼容问题一:不同浏览器的标签默认的外补...
    _Yfling阅读 13,861评论 1 92
  • 学习CSS的最佳网站没有之一 http://www.w3school.com.cn/tags/index.asp ...
    Amyyy_阅读 1,108评论 0 1
  • 第6章 开始学习CSS,为网页添加样式 1、认识CSS样式CSS全称为“层叠样式表 (Cascading Styl...
    夏沫xx阅读 1,076评论 1 11
  • 1.CSS 元素选择器 最常见的 CSS 选择器是元素选择器。换句话说,文档的元素就是最基本的选择器。如果设置 H...
    饥人谷_小侯阅读 891评论 0 1