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

标题: 零基础前端-辛洋-20230413 [打印本页]

作者: 肤浅1543 时间: 2023-4-13 23:08
标题: 零基础前端-辛洋-20230413
CSS的语法规范

注意点
选择器用于指定选择哪个元素，{}里面写的是对这个元素的具体样式设置。
属性和属性值之间用“:”来隔开的，属性和属性值的这种形式也叫做键值对。
多对属性和属性值之后要用";"来结尾。

CSS的基础选择器
类选择器
注意点类选择器使用“.”来定义，用class来调用，在调用的时候不要写“.”。如果类名比较长，可以使用横线来进行连接不要使用纯数字、中文等来进行命名，类名要有意义，尽量都使用英文字母
ID选择器
注意点
用#来定义，用id来进行调用。
一个页面中同一个id选择器只能被调用一次，不能调用多次，因为id选择器中的样式一般都会比较特殊。

id选择器和类选择器之间的区别
类选择器好比人的名字，一个人可以有多个名字（多类名的使用），也可以一个名字可以被多个人使用（同一个类名被多次调用）
id好比人的身份证号码，每个人都是唯一的编号
id选择器一般情况下会和JS一起联合使用来为页面中的特殊的元素设定状态。
文本装饰使用text-decoration属性来控制文本的装饰常用的属性值 none 默认值，没有装饰（给a标签去掉下划线，使用频率最高） overline 上划线 line-through 删除线 underline 下划线文本缩进使用text-indent属性来控制文本的缩进（指的是第一行缩进），通常用在段落的首行。属性值固定像素单位，比如20px 相对单位 2em em是一个相对单位，相对的是当前元素的font-size的大小，1em就是一倍的font-size值，想要缩进两个字符就可以写成2em。行间距使用line-height属性来设置行高，可以控制文字行与行之间的距离属性值具体像素值 font-size的倍数，推荐使用倍数，可以让页面中的字体根据自己的实际来自适应行高。使用line-height来实现文本的垂直居中将line-height的属性值设置成和父元素的高度一致即可。文本换行通过white-space属性来控制文本是否换行normal 默认值换行nowrap 控制文本到达父元素边界不换行CSS的引入方式内部样式表内部样式表，是写到html页面的内部，将所有的样式代码写到<style></style>标签中。注意点 1、style标签其实可以写在页面的任何地方，但是我们推荐写在head标签中 2、它能够实现结构和样式的部分分离（没有完全分离） 3、代码结构更加清晰，平时练习的时候，推荐使用这种方式行内样式表行内样式表就是将样式写在标签的style属性中，适合于简单的样式修改注意点样式要写在style属性后的双引号中样式格式要复合CSS的语法规范只用于简单的样式修改，一般不推荐使用这种方式外部样式表实际开发中都是使用外部样式表，适合于样式比较多的情况使用方式1、先创建一个css文件2、在html文件中使用link标签来引入css文件即可 rel 定义当前文档与被链接文档之间的关系，这里直接指定为stylesheet，表示被链接的文件是一个css样式表 href 定义链接的css文件的路径（URL）

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