2020年2月20日-工作

总结：来源网址：http://houdunren.gitee.io/note/

1. flex布局：https://www.houdunren.gitee.io
	来源: http://houdunren.gitee.io/note/    2---13
2. 选择器：
	列出Unicode编码表	
	选择器可以搭配使用！
	子代选择器： >
	后代选择器： 空格
	兄弟选择器： ~
	相邻兄弟选择器： +
	属性选择器： [title="aaa"] 	表示有这个属性的元素，都能应用该样式
	其中 ^= 表示以某名字开头的； $= 表示以 .com结尾的； *= 表示含有某字符的
	|= 、~= 不常用
	伪类选择器：::link、::visited、::hover、::active、::focus、::target、::root、::empty、
	::first-child 注意a ::first-child和a>::first-child、::first-of-type: 选中类型里的第一个
	::last-child
	::only-child:选中后代中有唯一元素的标签
	::only-of-type:
	::nth-child(1): 需要学习下、传入2n、even、odd可以实现隔行换色的效果
	::nth-of-type 、::nth-last-child、::nth-last-of-type
	::not: 排除选择器，可以结合使用
	checked、disabled、required、valid、invallid等属性可以当成伪类来使用，用于表单中
	::first-letter、::first-line
	::before、::after: 需要声明content属性，可以是万国码 \2193
3. 权重：
	来源： http://houdunren.gitee.io/note/	这里有权重数字详细表，权重可以叠加！
	继承没有权重的理解？
	继承与通配符的博弈？
4. 字体使用没那么简单： 用户的电脑里如果没有某种字体，是没办法显示的
	字体可以这样结合使用
	字体可以转化大小写等、文本阴影类似于盒子阴影
	空白和文本异溢出处理; 空白pre属性（标签和white-wrap:pre;）、不换行+文本溢出隐藏+溢出点
	文本缩进： text-indent: 2em;
	字符间距、单词间距：letter-wrap: 2px; word-wrap: 4px;
	字体包的引入可以使用
	@font-face {font-family: ""; src: url('') format("opentype")}
	字体的适应，em单位相当无百分比，是根据父级定义的
	引入图标库：http://www.fontawesome.com.cn/
5. 盒模型：
	轮廓线： ouline: 20px; 轮廓线不会占用位置
	隐藏的两个属性：display: none; visibility: hidden;
	尺寸控制：min-width
	充满剩余空间： fill-available: 
	根据内容显示大小： width:fit-content; 感觉没啥用
6. 背景为图片
	background: url('')，url(''),url('');
	background-clip: content-box; 背景裁切，只在内容中添加背景，其他的属性需要学习
	background-repeat: no-repeat;
	等等 ，还有很多其他的属性
7. 渐变色：
	background: linear-gradient(180deg or to left,red, blue,green);
	background: radial-gradient(); 竖向渐变
	background: repeat-linear-gradient(); 重复线性渐变
	可以添加标志位：颜色后面加上尺寸即可
8. css定制表格 bootstrap已经封装好
	伪选择器+display: table;
	标题： caption
	空单元格和线的处理
9. 列表样式
	list-style-type: none; 去掉ul的点
	list-style-image: url 或 渐变;
10. 炫酷的表单
	p70讲 可以学学
11. 清除浮动的一个新技巧：clear: both; display: block;
	在子元素中添加一个空元素，利用它清除浮动
	after清除浮动，尾部增加元素来撑开父级高度
12. 文本的特殊化怎么使用
	shape-outside、clip-path::ellipse()等、属性没见过
13. 粘性定位：
	position: stickly;