理解CSS|青训营笔记

120 阅读2分钟

这是我参与「第四届青训营 」笔记创作活动的的第2天

前言

这次笔记的内容是我对课程css的总结

理解css

用来定义页面元素的样式

  1. 设置字体和颜色
  2. 设置位置和大小
  3. 添加动画效果

用法用途及举例

css有着字体样式、文本样式、列表样式、背景、边框、内外边距样式、盒子模型、浮动模型、链接、鼠标样式等等。

css书写基本要求:

                    1."属性名:属性值;"
			注意:
				在HTML中,属性名和属性值之间是用"="链接的
				在css中,属性名和属性值之间是用":"链接的
				在上述操作栗子中,style="color: red;font-size: 20px;"
					style是HTML中的属性,""中的内容是HTML中的属性值,二者用"="连接
					colorfont-size是css的属性,red和20px是css中的属性值,二者用":"连接
					这里的css整体作为了HTML的某个属性值
		2.属性值是对属性的相关描述
			不做过多介绍
		3.属性名必须是一个合法有标识符
			如果我们把font-size写错了,写成zt,那么20px不会生效,运行后,字体自动变成默认大小。
                            
                            
                            

选择器

  1. 标签选择器
  2. ID选择器
  3. 类选择器
  4. 后代,并集,交集选择器
  5. 通用选择器

伪类

1.伪类和伪元素,应该归属到css的选择器中, 但我们在学习选择器的时候,我们知道选择的是元素,而伪类和伪元素不是标签原色。

2.什么是伪类?

元素不同状态表现不同样式分为静态伪类和动态伪类。

颜色

222.png

字体

文字颜色: color: 合法的颜色值

文字大小 font-size: 合法的尺寸单位;

文字加粗 font-weight: 600;

尺寸样式

宽度设置 width: 合法的尺寸单位;

高度设置 height: 合法的尺寸单位