一、css用途和使用方法
1.主要为网页添加样式，可理解为让网页长成怎么样
2.三种使用方法：外部 CSS、内部 CSS、行内 CSS
(1)、外部 CSS
--通过使用外部样式表，您只需修改一个文件即可改变整个网站的外观！
--每张 HTML 页面必须在 head 部分的 <link> 元素内包含对外部样式表文件的引用。
<!DOCTYPE html>
<html>
<head>
<link rel="stylesheet" type="text/css" href="aa.css">
</head>
<body>
<h1>外部使用css</h1></body>
</html>
(2)、内部 CSS
--内部样式是在 head 部分的 <style> 元素中进行定义。
<!DOCTYPE html>
<html>
<head>
<style>
body {
background-color: linen;
}
h1 {
color: maroon;
margin-left: 40px;
}
</style>
</head>
<body>
<h1>内部样式css</h1>
</body>
</html>
(3)、行内 CSS，也叫内联样式 在元素内用style声明
<!DOCTYPE html>
<html>
<body>
<h1 style="color:blue;text-align:center;">这是行内样式</h1>
</body>
</html>
二、CSS 语法
步骤1、选择器指向您需要设置样式的 HTML 元素。这里指向的是h1元素
步骤2、声明块包含一条或多条用分号分隔的声明。
步骤3、每条声明都包含一个 CSS 属性名和值，以冒号分隔。
步骤4、多条 CSS 声明用分号分隔，声明块用花括号括起来。
三、CSS 选择器
1、 用途：用于选取要设置样式的 HTML 元素。
四、CSS 选择器分类
1、CSS 选择器分为五类：
简单选择器（根据名称、id、类来选取元素）
组合器选择器（根据它们之间的特定关系来选取元素）
伪类选择器（根据特定状态选取元素）
伪元素选择器（选取元素的一部分并设置其样式）
属性选择器（根据属性或属性值来选取元素）
五、简单选择器
1、id选择器 ---- # 号 特点：唯一
#aa { text-align:center;color:red;}
2、class类选择器 ------ . 号
.aa { text-align:center;color:red;}
3、元素选择器 ------- 每一个特定元素，比对所有p元素设置字体颜色为红色
p{color:red}
4、通用选择器 ------- 通用选择器（*）选择页面上的所有的 HTML 元素。
*{text-align:center;color:red;}
5、分组选择器 ----- 用 ，隔开
p,div{color:red}
.aa,p{color:red}
六、颜色
1、背景颜色： background-color
2、字体颜色：color
3、CSS 颜色值：rgb(255, 99, 71) 或者 #ccc 或者 rgba(0,0,0,0.4)或者颜色名（red、blue等）
颜色取值参考网址：https://www.sioe.cn/yingyong/yanse-rgb-16
网友评论