Css学习笔记

css常用效果

效果	写法
文本垂直居中	设置line-height与height等高
文本水平居中	设置text-align:center
设置宽度包括边框	设置box-sizing:border-box;
转化行内元素	设置display:block
绝对定位不占位置空间	position:absolute
消除列表li标签前的原点	设置list-style:none
消除链接标签的下划线	设置text=decoration:none
设置边框虚线	border-style:dashed;
设置鼠标悬停显示效果	xxx div{display:none} ; xxx :hover div{display:block} ;
将border和padding数值包含在width	box-sizing:border-box
设置阴影边框	0 1px 3px 0 rgb(0 0 0 ,0.1)
设置float不占位
显示文本中的多个空格	white-space:pre;

伪类选择器

• :hover - 当鼠标悬停在元素上时应用的样式。
• :active - 当元素被激活或被点击时应用的样式。
• :visited -用于访问过的链接的样式。
• :focus - 当元素获得焦点时应用的样式。
• :nth-child(odd) -奇数列
• :nth-child(4n + 3) -每4个元素中的第3个

伪元素

• ::before - 在选定元素的内容之前插入内容。
• ::after - 在选定元素的内容之后插入内容。
• ::first-line -选取文本的第一行。
• ::first-letter - 选取文本的第一个字母

.body{
	padding:0;
	margin:0;
}