一、什么是css
1.CSS(Cascading style sheet) 称为层叠样式单
2.它是一种 专门描述结构文档的表达方式的文档，主要用于网页风格设计，包括字体、大小、颜色、以及元素的精确定位等.
3.在传统的web网页设计里，使用css能让单调的html网页更富表现力
CSS与传统HTML描述数据方式比较有哪些优势
1.表达效果丰富
2.文档内容比较小
3.便于信息检索
4.可读性好
二、CSS引用方式
1.内部样式： 优先等级1
<p style="font-size: 40px;background-color: #777777;">正文内容3</p>
2.内联样式： 优先等级2
<style type="text/css">
h2{
color: #FF0000;
font-family: 黑体;
}
</style>
3.链接外部样式文件：link 优先等级3
<link rel="stylesheet" type="text/css" href="stylecss.css">
4.导入外部样式文件： 优先等级4
<style type="text/css">
@import "路径"
</style>
三、css样式的语法定义格式
selector{
property:value;
property:value2;
}
对应翻译：
selector:选择器 (定义选择器的名称和类型,总的有3种类型)下面展开
property:属性
value:属性值：
四、选择器的类型
选择器的意思是指定对那些标签起作用
- 类选择器
语法
.类名{
样式内容
}
调用类选择器样式
<标签 class="类名"></标签>
2.id选择器
ID名{
样式内容
}
调用类样式
<标签 id="ID名"></标签>
3.标签选器/标记选择器
标签名{
样式内容
}
4.属性选 择器 只要包含有这个title属性的都会生效
[title]{
color:red;
}
五、调用类样式
<标签 ></标签>
上课案例分享：
html部份 文件名为：index.html
<!DOCTYPE html>
<html>
<head>
<title>css简介</title>
<meta charset="utf-8">
<!-- <link rel="stylesheet" type="text/css" href="mycss.css"> -->
<style type="text/css">
@import "mycss.css"
</style>
</head>
<body>
<h1 dir="rtl">春晓</h1>
<h2 hidden>春城城夺</h2>
<p class="mycss">春晓春晓春晓</p>
<div id="auther" style="font-size: 40px;">作者：joychen</div>
<h1 id="myid" class="myname" style="" >三班</h1>
</body>
</html>
css部分，文件名为mycss.css
h1{
font-size: 70px;
color: red;
}
h2{
font-size: 30px;
color: #abcdef;
}
.mycss{
font-size: 24px;
color: #ffcc11;
}
#auther{
font-size: 20px;
color: blue;
}
