1.css介绍
层叠样式表(英文全称：Cascading Style Sheets)是一种用来表现HTML（标准通用标记语言的一个应用）或XML（标准通用标记语言的一个子集）等文件样式的计算机语言。CSS不仅可以静态地修饰网页，还可以配合各种脚本语言动态地对网页各元素进行格式化
简单来说HTML:搭建网页结构CSS:修饰和美化网页
2.CSS 使用方式（重点）
（1）内联方式
又称：行内样式，内联样式
特点：将CSS的内容定义在单独的HTML标签中。
语法：
<标记 style=‘样式声明’>
样式声明：
1.样式声明是用样式属性和值来组成的
2.属性 和 值 之间的使用：连接 。
3.在一个style中可以出现多个样式声明，多个样式声明之间用;隔开。
常用的属性和值：
1.文字大小
属性：font-size
取值：以px为单位的数字
2.文本颜色：
属性：color
取值：取值为表示颜色的英文单词。
3.背景颜色
属性：background-color
取值：取值为表示颜色的英文单词。
例子：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>内联</title>
</head>
<body>
<p style="background: pink"> I love you</p>
</body>
</html>
（2）内部样式表
1.作用
让定义好的样式能够使用在当前页面的多个元素上。
2.语法
<head>
< style>
样式规则1
样式规则2
...
</style>
</head>
样式规则：
有选择器 和样式声明 组成的
目的：为了声明一组独立的样式
选择器：规范了页面中的那些元素能够使用声明好的样式。
选择器{
属性1：值1；
属性2：值2；
}
例子：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>内部样式</title>
<style>
p{
background-color: plum;
}
</style>
</head>
<body>
<p> I love you</p>
</body>
</html>
3.外部样式表：
1.作用：
（1）将声明好的样式应用在多个网页中
（2）将样式规则声明在独立的CSS文件中(***.css)
（3）在使用的网页中对css文件进行引入即可
2.使用步骤
1.声明
创建.css文件，并编写样式规则
2.引用
<head>
<link rel='stylesheet' href='css文件路径'>
</head>
例子：
<!DOCTYPE HTML>
<html>
<head>
<meta charset="utf-8">
<title>美食网站</title>
</head>
<link rel="stylesheet" type="text/css" href="css/美食.css"/>
<body>
<p>欢迎来到美食网站</p>
</div>
</body>
</html>
3.样式表的特征
1.继承性
大部分CSS属性由父元素传递个子元素中去
2.层叠性
允许为一个元素定义多种方式或者多个样式规则。
3.优先级
允许为一个元素定义多种的使用方式或者多个样式规则，如果样式声明冲突的话，会按照不同方式的优先级来应用样式
浏览器： 低
内部或外部样式表：中
如果起冲突，找一下 谁近显示谁的。
内联方式： 高
扫一扫
2550
被折叠的 条评论
为什么被折叠?
到【灌水乐园】发言
