HTML第三节
一.初识CSS
1.CSS定义
A.内部样式表
B.外部样式表
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<link rel="stylesheet" href="./第一次.css">
</head>
<body>
<p>这是p标签</p>
<div>这是div标签</div>
</body>
</html>P{
color: aquamarine;
}
div{
color: brown;
font-size: 30px;
}C.行内写法
二.选择器
1.标签选择器
注：1.所有的p标签都会设置成一个格式
2.类选择器 （差异化）
注：1.先定义类，再使用类
2.一个class属性可以使用多个类名
3.定义类前面要加.
3.id选择器
4.通配符选择器
注：作用：清除页面中所有标签的默认格式，方便后续设置每一项格式
三.利用类选择器画盒子
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
<style>
.red{
width: 100px;
height: 100px;
background-color: red;
}
.orange{
width: 200px;
height: 200px;
background-color: orange;
}
</style>
</head>
<body>
<div class="red">div1</div>
<div class="orange">div2</div>
</body>
</html>四.文字控制属性
（一） 字体大小
注：1.默认字体大小为16px
（二）字体粗细
（三）字体倾斜
注：1.字体倾斜不好看，一般用font-style清除文字的倾斜效果
（四）行高
1.行高的书写方法
2.行高的测量方法
3.垂直居中
注：1.盒子高度即为height，好像涉及盒子模型
（五）字体族
注：1.从左向右依次查找，先找到哪个就用哪个
（六）font复合属性
注：1. 具体设定的属性值可以从京东等网站上复制
2.设置所有字体的初始格式，如果有需要单独设置的字体则单独设置
（七）文本修饰属性
1.文本缩进
注：1.2em表示首行缩进两个字号大小的距离
2.文本对齐
注：1.居中的本质是文字内容居中
3.图片实现居中效果
注：1. 要将属性设置给内容的父级，内容外要套div标签
4.文本修饰线
（八）字体颜色
注：1.其中第二种写法数字越大颜色越深
五.调试工具 
注：1.调试工具在浏览器检查页面中
本文是对B站上黑马免费课程的总结，供个人学习使用
