提示：这里可以添加本文要记录的大概内容：
例如：随着人工智能的不断发展，机器学习这门技术也越来越重要，很多人都开启了学习机器学习，本文就介绍了机器学习的基础内容。
一、CSS简介
CSS指层叠样式表，它不是一门标准语言，主要用来美化页面，扩展名为 .css.可以将CSS文件通过link外链独立出去，解决内容与表现分离的问题
less和scss是css的超集，浏览器不能直接解析less文件或scss文件，必须经由特定的解析器编译为css文件然后执行，less和scss丰富了css的编写规则，让css代码也可以支持变量、嵌套、混合、函数、继承等多种只有标准语言才有的方法
二、CSS定义
外链导入
link标签一般是放在head标签内的
html5中 link的type属性是默认导入，可以省略
link如果遇到script脚本标签，那么style应该放在script的上面。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="./jxs1.css">
</head>
内嵌导入
html5种type属性是默认导入的，所以type="text/css"可以省略
style标签一般放在head标签内的
style如果遇到script脚本标签，那么style应该放在script的上面。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
div{
background-color: red;
}
</style>
行内导入
可以将样式代码写在标签style属性上面，称为行内样式
<div style="color:red;font-size:16px">123</div>
CSS样式区别
| 优缺点 | |
|---|---|
| 外链导入 | 外链独立一个文件，开发效率很高，但是会增加http请求 |
| 内嵌导入 | 内嵌开发效率低，但是执行速度快，没有http请求 |
| 行内导入 | 行内不利于写大量代码，但是可以和js交互，不需要为命名烦恼 |
CSS语法
- css代码写在英文{}里面
- css属性和值用英文字符;分割
- 最后一个属性英文分号可以省略
- css语法出错不会报错，但是会导致代码不执行
CSS风格
紧缩风格
优点：收纳空间
缺点：不容易阅读
div{color: red;background-color: yellow;}
展开的风格
优点：容易阅读
缺点：占用空间
div{
color: red;
background-color: yellow;
}
css注释
同时支持单行和多行注释
div{
/* 注释文字，支持换行 */
}
总结
初步了解CSS
扫一扫
588
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
