菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育

标题: 前端学习第四天-范建荣-20230413 [打印本页]

作者: °荣 时间: 2023-4-13 21:50
标题: 前端学习第四天-范建荣-20230413
一、学习内容
基础选择器

标签选择器：

概念：指用HTML的标签名作为选择器，按照标签的类型来设置统一的css样式

特点：可以快速选择页面中的某一类标签来设置样式，但是不能为同一类标签设置差异化的样式

类选择器：如果想差异化选择不同的标签来设置样式，可以使用类选择器

注意点：类选择器用“ . ”定义，用class来调用，在调用时不要写“.”如果类名比较长，可以使用横线来进行连接不要使用纯数字、中文等来进行命名，类名一定要有意义、尽量都使用英文字母

多类名的使用

注意点：在标签中使用多个类的时候要用空格将多个类名隔开；可以根据自己想要的样式来调用不同的类名，类名的多少可以自己选择

Id选择器；Id是唯一的页面标识，通常是为HTML来某个特定元素来指定的定的样式，css中id选择器用“#”来定义

注意：用“#”来定义，用id来进行调用；一个页面中同一个id选择器只能被调用一次，不能调用多次，因为id选择器中的样式一般都会比较特殊

类选择器和id选择器的区别

类选择器好比人的名字，一个人可以有多个名字（多类名使用），也可以一个名字被多人使用（同一个类名被多次调用）

Id好比人的身份证号码，每个人都是唯一的编号

Id选择器一般情况下会和js一起联合使用来为页面

通配符选择器：在css中通配符选择器用*来定义，表示选择页面中的所有的元素（标签）

Css文本属性

文本颜色

使用color属性，设置文本的颜色

属性值：预定义的颜色：red yellow green等；RGB颜色：rgb(255,0,0)代表纯红色，每个颜色在0-255之间取值/也可用%来取值；十六进制：数字和字母组成

文本对齐：

使用test-align属性来设置文本的对齐方式；属性值：center left right, 默认左对齐

文本装饰

使用text-decoration属性来控制文本的装饰；none默认值没有装饰（给a标签去除下划线；Overline 上划线；Underline 下划线；line-through 删除线

文本缩进

使用text-indent属性来控制文本的缩进（指的是第一行缩进），通常用在段落的首行；属性值：固定像素的单位，比如20px，相对单位2em

en是一个相对单位，相对的是当前元素的font-size的大小，1em就是一倍的font-size值，想要缩进两个字符可以写成2em

行间距

使用line-height属性来设置行高，可以控制文字行与行之间的距离：具体像素值

font-size的倍数，推荐使用倍数，可以让页面中方的字体根据自己的实际来自适应行高

使用line-height来实现文本的垂直居中，将属性值设置为父元素的高度一致即可

文本换行

通过white-space属性来控制文本是否换行：属性值；Normal默认值换行；nowrap控制文本到达父元素的边界不换行

二、遇到的问题
在超链接里面字体颜色怎么修改
三、解决方案
给超链接定义一个class，设置这个class的color为目标颜色即可

欢迎光临菁英数字科技（猩码）-猩码学苑-专注软件开发人才菁英教育 (http://www.xingmaxueyuan.com/)