欢迎加入前端技术营！如果你也是前端学习者或者对前端有学习的想法，那就跟着我一起从零开始进击前端。
致力于尽可能详细且简洁的介绍前端知识、自己的捷径，也是学习路上的记录。欢迎探讨
目录
一、CSS概述
二、CSS语法规范
三、CSS引入方式
四、面试题
一、CSS概述
前面我们说过，web标准是由结构、表现、行为构成，相对应的就是HTML、CSS、JS，并且最佳体验方案：结构、样式、行为相分离。
没错，接下来我们就要进入CSS的学习。
CSS就是层叠样式表，也是标记语言，用于美化网页，板面布局和外观显示样式，简言之，CSS就像是自己买的漂亮的衣服包包等用来装饰自己让自己更好看。
二、CSS语法规范
<head>
<style>
CSS写在head里，并用style包起来
</style>
</head>
css规则由两部分构成：选择器及一条或多条声明
选择器：就是用来选择标签用的，选择了后就用一条或多条声明修饰选中的标签，后面会详细介绍
声明：就是用来修饰标签的
键值对：属性：值；之间用冒号分隔,就是属性和值组成的一对
代码风格：
- 紧凑型：写在一行
- 展开式：一行一个属性
- 用小写字母写
- 属性值前加一个空格；选择器后也留一个空格
三、CSS引入方式
行内样式表：在元素标签内部的style属性中设定css样式，在双引号间
如：
<div style="color:red；">
内部样式表：方便控制整个页面元素样式设置，写到HTML页面内部，单独写到style标签中，就是上面语法规范下面的写法
<head>
<style>
CSS写在head里，并用style包起来
</style>
</head>
外部样式表（常用）:
适用样式较多的情况，样式单独写到css文件中，之后把css文件引入HTML使用
使用方法：1.新建css文件，写入样式代码
2.在HTML页面中，用link标签引入这个css文件
<link rel="stylesheet" href="css文件路径"
外部样式表就是相分离的原则，可以使代码更清楚，但是如果做一个小demo，那就可以用内部样式表，择优而选
四、面试题
一、标签语义化
- 代码结构更加清晰
- 见名知意，没有基础的人也能知道这部分代码是干嘛的
- 方便团队开发维护，代码可读性更强
- 有利于SEO优化，爬虫依赖于标签来确定上下文关系
二、meta标签
- meta标签提供关于html文档的元数据，不会显示在页面，但是对于机器是可读的，告诉浏览器怎么解析页面，告诉搜索引擎关键字（SEO优化）
- meta作用：告诉机器浏览器该如何解析该页面，描述这个页面的主要内容，可以设置服务器发送到浏览器的http头部内容
- charset="utf-8"设置页面使用的字符编码
- viewport 设置视口，移动端的适配
- 下期：VScode常用插件介绍、Emmet语法介绍
- 点赞加关注，持续更新实用技巧、热门资源、软件教程等
- 有任何 软件 影视 教程资源 考证资料等需求留言即可
4773
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
