<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head><meta http-equiv="Content-Type" content="text/html; charset=utf-8" /> <title>无标题文档</title> <style type="text/css"<div> /*<div style="color:#906">Hello</div>*/ /*div.c1{color:#90C} span{color:#F03}*/ div,span,ul{color:#00F} </style> <link href="1.css" rel="stylesheet" type="text/css" /> </head> <body> <div style="color:#F00">Hello</div> <div> <div class="c1">你好</div> <div class="c1">晚安</div> <div class="c1">再见</div> <div class="c1">谢谢</div> </div> <span> <span>测试1</span> <span>测试1</span> <span>测试1</span> <span>测试1</span> </span> <ul> <li>后代1</li> <li>后代2</li> <li>后代3</li> <li>后代4</li> </ul> <style type="text/css"> </body> </html>
样式表 分类
一 内联 (写在标签里的样式)
<div style="">HELLO<.div>
二 内嵌 (嵌在页面里边)
写在<head>样式</head>
<style type="text/css">
</style>
三 外部样式表
新建css：从创建里找到CSS进行创建，进入窗口进行保存(ctrl+s)切回主页面点<head>右键找到css样式点进附加样式表进行合并
<link href="1.css" rel="stylesheet" type="text/css" />
以上三种优缺点
1 内联 优点 控制精确 (优先级最高)
缺点 代码重用性很差，造成页面代码乱
2 内嵌 优点 代码重用性好 (可以把全部元素找到统一)
缺点 控制不精确
3 外部 优点 代码重用性最好 (一般工作时使用，需要清理浏览器缓存)
缺点 控制最不精确的
内嵌和外部优先级一样
样式名：样式值
多个样式之间使用分号分隔
标签选择器
标签选择越精确优先级越高
复合选择器
可以组合使用
下午课程有些错综复杂，理清楚后，稍微清晰一些，需要多打多练，找出下午讲的重点，这样容易理清思路！