青训营笔记

73 阅读1分钟

理解CSS|青训营笔记

Screenshot_2023-01-16-23-11-19-892_com.ss.android.jpg

页面使用css三种方法:外链、嵌入、内联 Screenshot_2023-01-16-23-12-13-966_com.ss.android.jpg 一般推荐用外链

选择器Selector

用来找出页面中的元素,以便给他们设置样式 可以使用多种方式选择元素例如按照标签名、类名或id;按照属性;按照DOM树中的位置。

通配选择器*(匹配所有)

Screenshot_2023-01-16-23-25-58-038_com.ss.android.jpg

标签选择器(用标签设置样式)

id选择器,设置时id在此页面需是唯一的值

类选择器

属性选择器:通过这个元素的属性值来设置

伪类:不基于标签和属性定位元素,可分为状态伪类(该元素处于特定状态)和结构性伪类(根据动节点在动树种出现的位置来决定石佛选择这个元素)。

组合方式

Screenshot_2023-01-16-23-38-25-026_com.ss.android.jpg 选择器组:用逗号隔开的选择器

Screenshot_2023-01-16-23-41-40-592_com.ss.android.jpg rgb可用来表示颜色,括号中从左到右为红绿蓝大小为0到255

hsl也可用来表示颜色

Screenshot_2023-01-16-23-45-22-341_com.ss.android.jpg

alpha透明度(0~1)

Screenshot_2023-01-16-23-48-35-949_com.ss.android.jpg

字体font-family

Screenshot_2023-01-16-23-50-09-382_com.ss.android.jpg 如图设置多个字体是因为可能多个用户访问,他们字体不一样。

通用字体族

Screenshot_2023-01-16-23-52-12-880_com.ss.android.jpg