CSS基础
css的整体
1.选择器
2.盒子模型
3.浮动
4.定位
5.动画,伸缩布局(CSS3部分)
CSS概念
作用:
1.美化网页(通过CSS控制标签的样式)
2.网页布局(通过CSS控制标签的位置)
概念
Cascading Style Sheets(层叠样式表|级联样式表|样式表)
注意:CSS是以HTML为基础。
书写方式:
内嵌式
1.先准备一个HTML页面
2.在HTML页面内的head标签中添加一个style标签
3.在style标签中写css代码
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Title</title>
<style type="text/css">
p {
color: red;
}
</style>
</head>
<body>
<p>只剩下麻木的我没有了当年的热血</p>
</body>
</html>
外链式
1.首先新建一个单独的css文件(在该文件中写css代码)
2.通过link标签将该css文件引入到当前的HTML页面中。
<head>
<link href="CSS文件的路径" rel="stylesheet" type="text/css">
</head>
type:定义的是所链接文档的类型,可省略
rel:定义当前文档和被链接文档之间的关系,在这里需指定为stylesheet,表示被链接的文档是一个样式表文件。
行内式
将css代码写在HTML标签内部也就是HTML的根标签中(行内式只对其所在的标签及嵌套在其中的子标签起作用)
<h1 style="color:red; font-size:20px;">也许永远都不会对她说出那句话</h1>
CSS的语法
选择器{属性:值;…}
选择器的分类
基础选择器
标签选择器
类选择器
id选择器
通配符选择器
复合选择器
标签指定式选择器
后代选择器
子代选择器
并集选择器
属性选择器
伪类选择器