css基础day02

作者: 兔子和猪 | 来源:发表于2017-02-20 21:10 被阅读0次

一、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基础day02

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

  • day03

    A我学习到了什么? 1温习day02的知识点 2css基本样式的讲解 3css样式的继承:子元素对父元素的继承 B...

  • 2018-07-10

    day02 1.html标签的使用 2.css的简单使用 color--文字的颜色line-height--行高会...

  • CSS学习资源

    基础篇 CSS 最核心的几个概念 CSS 简写指南 CSS样式基础 CSS样式设置 CSS布局模型 CSS文字排版...

  • 【2016年特别福利】史上最全CSS学习资料大全

    基础篇 CSS 最核心的几个概念 CSS 简写指南 CSS样式基础 CSS样式设置 CSS布局模型 CSS文字排版...

  • react学习路线图

    基础 HTML学习 HTML 基础学习 HTML 基础CSS学习 CSS 基础在上一步练习的基础上为页面添加样式使...

  • js基础day02

    js基础day02 一.循环语句 1.for循环 2.break和continue在循环中使用 break 在循环...

  • CSS初识

    CSS基础

  • css大纲

    css 基础 CSS 简介 在 html 中使用 css link 和 @import CSS 选择器 CSS 优...

  • #教育增长圈#操盘手训练营3期-葵葵森Ring-Day2-教育行

    ❤️2组-葵葵森Ring ❤️(Day02 打卡) 拆解案例:风变编程Python小课 0基础新手的编程学习平台,...

网友评论

    本文标题:css基础day02

    本文链接:https://www.haomeiwen.com/subject/renewttx.html