Cascading Style Sheets(CSS)
1.CSS就是在HTML文档中,如何显示HTML标签,元素,以及他们的样式布局,前端页面的展示形式均由CSS来布局.
2.如何使用CSS
- 内部样式表
- head标签里<style></style>
- 内联样式,在HTML标签里面直接写style
- 外部样式表
- 内容
- 表现---可以直接引入写好的CSS样式文件(.css),提高效率
- 存储--存储在CSS文件中
- 基本语法
- 通过xxx{属性:值},等同于xxx{key:value}
- 选择器
- 基本选择器
- 元素选择器(名称选择器)---标签的名称:h1{key:value}
- 属性选择器---id=“属性名称”,一般由#号后面跟属性名称,
- 类选择器---class选择器,class关键字,用来描述一类样式的元素---.类名{key:value}
- 高级选择器
- 分组选择器(组合选择器)---小组1,小组2,小组3...
- 通用选择器---*{margin:0;padding:0}
- 后代选择器---选择器1 选择器2 选择器3...比如:h1 p{}
- 兄弟选择器
- 子元素选择器---比如:ul>li{}
- 伪类选择器---a:hover{},a:active{}.a:visited{}
- 基本选择器
- CSS注释---/**/
- 常见的属性
- 宽高
- width
- hegiht
- 颜色
- color--值
- 颜色名称:red
- 颜色进制:#000000
- 颜色标识:rgb/rgba
- color--值
- 背景
- background-color
- background-image
- background-repeat
- background-postion
- 字体
- font-size---修改字体大小
- font-family---使用哪种字体
- font-style:normal
- font-weghit:normal bold
- 文本
- text-align:center,left,right
- 链接
- a标签:link,active,hover,visited
- 列表
- 有序列表
- list-style:图片,原点,小三角,矩形,星号...
- 无序列表
- 有序列表
- 表格
- table---表格
- tr
- th
- background-color
- td
- text-align
- vertical-align
- table-collapse
- table---表格
- 轮廓
- outline
- outline-color
- outline-style
- outline
- 宽高
- 盒子模型
- 盒模型
- 边框
- 外边框
- 内边框
- 定位和浮动
- float:涉及元素的排列方式---left,right
- position
- fixed(固定)
- absolute(绝对定位)
- relative(相对定位)
- DIV标签布局
标签:层叠,标签,---,样式表,background,选择器,CSS From: https://www.cnblogs.com/zhaoyunxiang/p/16484240.html