CSS:cascading style sheet(级联样式表)
- 菜鸟教程网址: 菜鸟教程 - 学的不仅是技术,更是梦想! (runoob)
- w3school网站:https://www.w3school/
- CSS:cascading style sheet:层叠级联样式表
- 1.0时只有基本样式,如h1标签的加粗等.
- 2.0时加入DIV块和css,提出HTML+CSS结构分离思想:让网页变得更简单,让网页开始做SEO
- 2.1时加入浮动定位
- 3.0时加入圆角,阴影和动画,但要注意浏览器兼容性
养成规范思想:让css单独一个文件夹
引入方式:样式判断时釆用"就近原则"
- 离要更改样式,的内容越近,优先级越高
- 行内>内联样式表>外联样式表
- 内部样式表:在head里面写style标签,在里面写css样式
<head>
<style>
*,ul,li{
margin: 0px;
padding: 0px;
font-size: 12px;
list-style: none;
}
</style>
</head>
- 外部样式表:link标签引入外部后缀名为.css的文件
<head>
<link rel="stylesheet" href="css/index.css">
</head>
- 行内样式:不建议使用,只在想偷懒时的特殊情况下使用
<span style="color: red">Hello World</span>
- @import导入:要写在style的最前面,2.1版本特有
<style>
@import url("淘宝网首页/css/index.css");
</style>
网页页面"右键 - 检查",我们可以看到在控制台有相应的css和文件和style样式
加入css后的优势
- 内容与表现分离,网页结构表现统一,代码可复用
- 样式丰富
- 建议独立于html,即引入css文件
- 利于SEO,易被搜索引擎收录
- 建议先写html(骨架),再写css(样式)
更多推荐
CSS基础常识之引用方式和优势
发布评论