HTML+CSS笔记四

更多的选择器

伪类选择器

1.first-child，选中第一个子元素
2.last-child，选中最后一个子元素
3.nth-child，选中指定的第n个子元素
even：关键字，等同于2n
odd：关键字，等同于2n+1
4.nth-of-type，选中指定的子元素中第n个某类型的元素

伪元素选择器

1.first-letter：选中元素中第一个字母/文字
2.first-line：选中元素中第一行的文字
3.selection：选中被用户框选的文字

更多的样式

透明度

1.opacity，设置的是整个元素的透明度，取值为0~1
2.在颜色位置设置alpha通道（rgba）

鼠标

使用cursor设置

盒子隐藏

1.display：none，不生成盒子，可能会改变其他盒子的排布
2.visibility：hidden，生成盒子，只是从视觉上移除盒子

背景图

和img元素的区别

img元素属于HTML概念，背景图属于CSS概念
1.当图片属于网页内容时，必须用img元素
2.当图片仅用于美化页面时，必须使用背景图

涉及的CSS属性

1.background-image:url 引入图片地址
2.background-repeat
默认情况下，背景图会在横坐标和纵坐标中进行重复
3.background-size
预设值：content，cover，类似object-fit。数值或百分比。
4.background-position
设置背景图的位置
预设值：left，right，bottom，top，center
数值或百分比
雪碧图(精灵图)(spirit)
5.background-attachment
用它控制背景图是否固定。值设为fixed则固定背景图