1、CSS
(1)CSS简介
(2)定义样式:选择器,以及一条或多条声明
(3)CSS的引入方式和书写规范
(3.1)内嵌样式
内嵌样式是把css的代码嵌入到html标签中
<div style="color:red;font-size: 100px;">你好啊 小朋友</div>
不建议使用
(3.2)内部样式
在head标签中使用style标签进行css的引入
<style type="text/css">
div{color:red;font-size: 100px;}
</style>
(3.3)外部样式
将css样式抽取成一个单独css文件 谁去使用谁就引用
<link rel="stylesheet" type="text/css" href="demo1.css"/>
(3.4)@import方式
<style type="text/css">
@import url("css地址");
</style>
link与@import方式的区别:
(1)link所有浏览器都支持 import部分低版本IE不支持
(2)import方式是等待html加载完毕之后在加载
(3)import方式不支持js的动态修改
(3)CSS中样式的继承
body {font-family: Verdana, sans-serif;}
根据上面这条规则,站点的 body 元素将使用 Verdana 字体(假如访问者的系统中存在该字体的话)。通过 CSS 继承,子元
素将继承最高级元素(在本例中是 body)所拥有的属性(这些子元素诸如 p, td, ul, ol, ul, li, dl, dt,和 dd)。不需要另外的规
则,所有 body 的子元素都应该显示 Verdana 字体,子元素的子元素也一样。
有些浏览器不支持继承:可以通过使用我们称为 "Be Kind to Netscape 4" 的冗余法则来处理旧式浏览器无法理解继承的问题
如果你不希望 "Verdana, sans-serif" 字体被子元素p继承,可以针对 p 的特殊规则,这样它就会摆脱父元素的规则。
(4)常用的选择器
元素选择器;id选择器;class选择器;(选择器的优先级:id>class>元素)
属性选择器:对带有指定属性的 HTML 元素设置样式;http://www.w3school.com.cn/css/css_syntax_attribute_selector.asp
派生选择器:http://www.w3school.com.cn/css/css_syntax_descendant_selector.asp
(5)CSS伪类和伪元素
http://www.w3school.com.cn/css/css_pseudo_classes.asp
http://www.w3school.com.cn/css/css_pseudo_elements.asp
(6)CSS框模型和定位
(6.1)外边距合并问题:http://www.w3school.com.cn/css/css_margin_collapsing.asp
(6.2)定位:http://www.w3school.com.cn/css/css_positioning.asp
(7)CSS样式分类
2、CSS3
(1)CSS3 是最新的 CSS 标准。
(2)新的边框属性:http://www.w3school.com.cn/css3/css3_border.asp
(3)新的背景属性:http://www.w3school.com.cn/css3/css3_background.asp
(4)新的文本属性:http://www.w3school.com.cn/css3/css3_text_effect.asp
(5)@font-face 定义“自己的”字体 :http://www.w3school.com.cn/css3/css3_font.asp
(6)2D和3D转换 对元素进行移动、缩放、转动、拉长或拉伸:http://www.w3school.com.cn/css3/css3_2dtransform.asp
(7)CSS3 过渡和CSS3 动画:http://www.w3school.com.cn/css3/css3_transition.asp
(8)CSS3 多列 http://www.w3school.com.cn/css3/css3_multiple_columns.asp
(9)新的用户界面属性 http://www.w3school.com.cn/css3/css3_user_interface.asp