元素标签，常识

伪类选择器和伪元素

正常连接

x:link{
    color:green;
}

访问过的链接

x:visited{
    color:yellow;
}

鼠标滑过的链接

x:hover{
    color:skyblue;
}

正在点击的链接

x:focus{
    backgroud-color:orange;
}

选中的元素

x::selection{
      background-color:white;
}

兼容火狐浏览器

x::-moz-selection{
        background-color:orange;
}

伪元素

(给段落定义样式)

首字母

x:first-letter{
    color:red;
    font-size:30px;
}

首行

x:first-line{
      background-color:orange;
 }

before(前面)

x:before{
    content:"我在文章的最前面";
    color:skyblue;
}
需要用content(内容)来定义内容

after(后面)

x:after{
    content:"我会出现在文章的最后面";
    color:red;
}

属性选择器和子元素选择器

p[title]{
    background-color:red;
}
选择器为title的背景变为红色

p[title="abc"]{
    background-color:skyblue;
}
选择器是title等于abc的背景变为天蓝色

p[title^="a"]{
    background-color:green;
}
选择器是title以a开头的背景变为绿色

p[title$="c"]{
    background-color:yellow;
}
选择器是title以c结尾的背景变为黄色

p[title*="b"]{
    background-color:orange;
}
选择器是title包含b的背景变为橙色

子元素选择器

选择第一个子元素

div p:first-child{
    color:red;
}

选择最后一个子元素

:last-child{
    color:yellow;
}

选择指定位置的子元素

:nth-child(3){
    background-color:green;
}
位置是第3个的标签背景为绿色

:nth-child(even){
    background-color:red;
}
位置是偶数的背景为红色

:nth-child(odd){
    background-color:yellow;
}
位置为基数的背景为黄色

选择指定类型的子元素

p:first-of-type{
    background-color:blue;
}
类型是p的第一个标签背景为蓝色

p:last-of-type{
    background-color:skyblue;
}
类型是p的最后一个标签背景为天蓝色

p:nth-of-type(3){
    background-color:yellow;
}
类型是p的第三个标签背景为黄色

.+.

span + p{
    background-color:skyblue;
}
span后一个p标签背景为天蓝色

.~.

 span ~ p{
    background-color:green;
}
span后面所有的p标签背景为绿色

否定伪类

p:not(#p1){
    color:red;
}

意思就是not()括号里面填什么,填的那句话就不会执行

样式的继承
给设置样式

body{
    font-size:30px;
}

body里面的所有元素都会继承body的样式

注:背景、边框、定义不会被继承

权重

!important
内联样式 优先级1000
id 选择器 优先级100
类和伪类 优先级10
元素选择器 优先级1
通配选择器 优先级0
继承的样式 没有优先级

注：如果优先级一样的会选择靠后的样式，后面的样式会覆盖前面的样式

！important

p{
    background-color:orange !important
}

如果非要用元素选择器来设置样式就要在后面加上!important

p{
  background-color:orange;
}

注：!important甚至比内联样式还有高，但是在开发的时候不建议使用

文本标签

标签用于表示一段内容中的着重点

#####2.标签表示一段内容的重要性

标签会使文字变成斜体电商的标签类似icon(图标)

标签会使文字变成粗体

标签会使文字变小

标签会使文字变大

使用标签可以指明对某内容的引用或参考。例如，戏剧，歌曲，文章，电影等

标签浏览器自动添加引号（不同浏览器的样式不同）写样式基本不用

(块元素)

标签评论的地方特别多如果引用了别人说的话就会使用
标签

定义上标和下标

和

标签表示插入的内容，显示时加上下划线 1808班的男生都好帅啊

标签表示插入的内容，显示时加上删除线 18.88 15.88

如果你的内容包含代码示例或文件名，就可以使用元素
元素表示的是预格式化文本，可以使用包含来表示一段代码 if(True): print("hello") 在网页中一共有3中列表 1.无序列表 ul li （块元素） 2.有序列表 ol li （块元素） 3.定义列表 dl dt （被定义的内#容）dd（对定义的内容描述）武大官人潘小娘子西门大官人武二官人一共有三种样式可以用type来取代取消样式在

元素 标签，常识

伪类选择器和伪元素

伪元素

属性选择器和子元素选择器

子元素选择器

权重

文本标签

在网页中一共有3中列表

1.无序列表 ul li （块元素）

2.有序列表 ol li （块元素）

3.定义列表 dl dt （被定义的内#容）dd（对定义的内容描述）

元素标签，常识