1.CSS基础
- 作用:增强控制网页样式,允许央样式信息与内容分离
- CSS不需要编译,可由浏览器直接解析
- 基本语法:选择符、属性、属性权值
p{
color:yellow;
}
- 不区分大小写,建议小写
- 属性与值之间用冒号;多个属性之间用分号
- 注释:/* 注释 */
2.CSS放置方式
(1)内联样式(行内引用)
<p style = "back-ground:pink"> </p>
(2)内嵌样式表(内部引用)
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p>这是P标签</p>
</body>
</html>
(3)外联样式表(外部引用)
第一种:link
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link rel="stylesheet" type = "text/css" href="./index.css">
<title>Document</title>
</head>
<body>
<p id="one">这是P标签</p>
</body>
</html>
#one{
background-color: aquamarine;
}
第二种:@import 文件
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<!-- <link rel="stylesheet" type = "text/css" href="./index.css"> -->
<title>Document</title>
<style>
@import "index.css"
</style>
</head>
<body>
<p id="one">这是P标签</p>
</body>
</html>
优先级:优先级最高的是内联样式表,其余内部引用与外部引用看谁最后定义就是谁优先级最高