CSS简介
css英文全称Cascading Style Sheets 层叠样式表,一种用来为结构化文档(如HTML文档或XML应用)添加样式(字体、间距和颜色等)的计算机语言,由W3C定义和维护。当前最新版本是CSS2.1,为W3C的推荐标准。CSS3现在已被大部分现代浏览器支持,而下一版的CSS4仍在开发中。
CSS的引入方式
1.内联方式
指的是直接在HTML标签中 style 属性中添加CSS
<div style="background: yellow"></div>
缺点:内联方式引入 CSS 代码会导致 HTML 代码变得冗长,且使得网页难以维护。
2.嵌入方式
嵌入方式指的是在 HTML 头部中的 <style> 标签下书写 CSS 代码
<head>
<style>
.content {
background: red;
}
</style>
</head>
此时只针对当前页面代码有效,因为代码集中,常用于模板便于一目了然查看代码信息。缺点:同样是页面复杂时会导致代码冗余,也不利于维护。
3.链接方式
指的是使用 HTML 头部的 <head> 标签引入外部的 CSS 文件
<head>
<link rel="stylesheet" type="text/css" href="./demostyle.css">
</head>
链接方式是最常采用引入CSS的方式,此时CSS存在单独的页面CSS文件中,便于维护,而且CSS 文件会在第一次加载时引入,以后切换页面时只需加载 HTML 文件即可。
4.导入方式
指的是使用 CSS 规则引入外部 CSS 文件
<style>
@import url(./demostyle.css);
</style>
导入方式用于在CSS文件中引入另一CSS文件。
笔记
在使用链接方式时,HTML标签需加入class并命名
<div class = "top"></div>
在CSS文件中的添加属性
.top{
background:black;
color:white;
}
注意class的命名前需加上 .
标签添加属性时不需要加点