学习来源:w3school 在线教程https://www.w3school.com.cn/
CSS使用
外部CSS
内部CSS
在head部分的<style>元素进行定义
行内CSS
读取优先级问题
最终是读取最后读到的样式
css颜色
CSS文本颜色
css边框颜色
CSS RGB颜色
RGBA
增加了不透明度 0.1-1
HEX值
HSL颜色
饱和度
亮度
css背景
background-color
属性指定元素的背景色
颜色设置
透明度
RGBA颜色值and透明度
注意:rgba是背景 总体颜色和透明度
Background-image
(默认图形重复达到覆盖元素的目的)
文字难以阅读
特定元素设置背景
background-repeat
只在水平方向重复
只在垂直方向重复
只显示一次背景图象
background-position
重要的一个设置 ,试着学习and应用
Background-attachment
background简写属性
总结
盒子模型
CSS边框
CSS边框属性
CSS边框样式
CSS边框宽度
注意 顺序 上右下左(顺时针 )
CSS边框颜色
特定边框颜色(上 右 下 左)
CSS边框各边
CSS简写边框属性
CSS圆角边框
Border-radius 添加圆角边框
总结:
CSS边距
CSS外边距
margin简写属性
如果有缺默认对称
auto值
inherit 值
CSS外边距合并
CSS内边距
设置方式与magrin相似
box-sizing
CSS宽度和 高度
注意属性不包括内边距,外边距,边框或外边框
max-width
CSS框模型
CSS轮廓
样式
CSS轮廓宽度
CSS轮廓颜色
CSS轮廓简写
CSS轮廓偏移
文本
CSS文本
CSS文本对齐
justify
Direction unicode-bidi
CSS文本装饰
Text-decoration
CSS文本转换
CSS文字间距
文字缩进(text-indent)
字母行距(letter-spacing)
行高 line-height
字间距(word-spacing)
空白(white-space)
无
CSS文本阴影
字体
字体样式
字体大小
em设置字体大小
1em=16px
谷歌字体
字体属性
CSS图标
Bootstap图标
<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css">
谷歌图标
<link rel="stylesheet" href="https://fonts.googleapis.com/icon?family=Material+Icons">
CSS链接
颜色不停的 变化
文本装饰
背景色
Target 按钮
CSS列表
定位列表标记
删除默认设置
列表简写属性
表单
表格宽度和高度
对齐
表格内距
水平分割
可悬停表格
条纹表格
表格颜色
响应式表格