一、介绍
层叠样式表(英文全称:Cascading Style Sheets)是一种用来表现HTML(标准通用标记语言的一个应用)或XML(标准通用标记语言的一个子集)等文件样式的计算机语言。CSS不仅可以静态地修饰网页,还可以配合各种脚本语言动态地对网页各元素进行格式化。 CSS 能够对网页中元素位置的排版进行像素级精确控制,支持几乎所有的字体字号样式,拥有对网页对象和模型样式编辑的能力
二、知识点介绍
1、CSS入门事例
2、CSS引入
3、CSS选择器
4、CSS声明
5、CSS注释
三、上课对应视频的说明文档
1、CSS入门事例
创建一个HTML文件
2、CSS引入
➢ 外部引用CSS
➢ 内部引用CSS
➢ 内联引用CSS
A、外部引入CSS
CSS外部引用使用了外接的CSS文件,一般的浏览器都带有缓存功能,所以用户不用每次都下载此CSS文件.
外部引用相对于内部引用和内联引用来说是高效的是节省宽带的.
外部引用是W3C推荐使用的.
外部引用CSS是最好的引入CSS的方式(可以使代码量最小,表现最统一,也是标准网页设计推荐的).
方法一:link引入
方法二:@import引入
B、内部引用CSS
可以使用style标签直接把CSS文件中的内容加载到HTML文档内部。
C、内联引用CSS
内联引用可以把CSS样式直接作用在HTML标签中。
3、CSS选择器
CSS选择符就是CSS样式的名字,当在HTML文档中表现一个CSS样式的时候,就要用到一个CSS.怎么用呢?这时就通过CSS选择符(CSS的名字)来指定此HTML标签使用此CSS样式
A、CSS选择符结构
B、CSS选择符的命名规则
CSS选择符可以使用英文字母的大写与小写,数字,连字号,下划线,冒号,句号.
英文字母大写与小写 A-Z a-z
数字 0-9
连字号 -
下划线 _
冒号 :
句号 .
C、CSS常用的三种选择符
标签选择符,比如 p标签选择符(代表所有的段落都使用这个CSS样式),比如 p{font-size:12px;}
id选择符,唯一性选择符,比如 #dreamdured{color:red;},就是在名字前增加了一个#,id选择符在一个页面中只能出现一次,在整个网站中也最好出现一次(这样有利于程序员控制此元素,有多个一样名称的元素,就无法分开不好控制了).
class选择符,多重选择符,比如.dreamdublue{color:blue;},就是在名字前增加了一个.,class选择符在一个页面中可以出现多次(注意下面的示例中class选择符的用法)
4、CSS声明
CSS声明是由"属性","冒号(:)","属性值"和"分号(;)"组成的。
A、CSS声明技巧一
选择符中定义的最后一个声明,声明后的分号可以省略
B、CSS声明技巧二
选择符的名字一样,声明是可以组合的
C、CSS声明技巧三
声明全部一样,选择符的名字也可以组合
5、CSS注释
CSS注释的开始使用 /*,结束使用*/
网友评论