pc端自适应

pc端自适应: 元素的大小能够顾随着窗口或者子元素自动调整

宽度自适应:
	设置宽度: width:100%; 块级元素默认100%
	或者不设置

高度自适应:
	设置高度: height:auto; 
	或者不设置: 由子元素撑开父元素的高度

	【注】
		如果想在height属性中以%为单位,那父元素必须有具体的高度
		或者所有的祖先元素到根元素都有height:100%;

最小宽高:
	min-width:最小宽度;
	max-width:最大宽度;

	min-height:最小高度;
	max-height:最大高度;
	【注】ie低版本不支持

	最小高度兼容写法:
		方法一:
			min-height:100px; 高版本浏览器识别
			_height:100px; 低版本ie识别

		方法二:
			mine-height:100px;  高版本浏览器识别
			height:auto !important;  高版本浏览器识别
			height:100px; 低版本ie识别
			【注】有顺序要求

visibility:显示隐藏;
	visible 显示(默认值)
	hidden 隐藏(占据文档流)

	visibility:hidden; 和 display:none;的区别
		都是对元素的隐藏
		前者占据文档流,后者脱离文档流

伪对象选择器:
	
	.box:after{content:"";}  在box的内容之后,生成最后一个子元素

	.box:before{content:"";} 在box的内容之前,生成最前面的一个子元素
	
	.box:first-letter{} 控制第一个字的样式
	.box:first-line{} 控制第一行字的样式
	【注】只针对块级元素有效

高度塌陷: 子元素设置浮动,父元素未设置高度,父元素高度将消失,引起页面布局混乱
	清除浮动(解决高度塌陷的办法):
		1: 给父元素添加高度
		缺点: 不灵活

		2: 给父元素添加oerflow:hidden;
		缺点: 内容超出父元素时,会被隐藏

		3: 给浮动子元素最后添加一个块级兄弟元素,并设置clear:left; left right both
		缺点: 代码冗余

		4: 万能清除法
			.clear_fix:after{
				content:".";
				display:block;
				clear:both;
				width:0;
				height:0;
				overflow:hidden;/*超出隐藏*/
				visibility:hidden;/*隐藏本身*/