css全部理解

	如何设置标签样式

	给标签设置长宽
		只有块儿级标签才可以设置长宽
		行内标签设置了没有任何作用(仅仅只取决于内部文本值)

	字体颜色 color后面可以跟多种颜色数据
		颜色英文 	red
		#06a0de   	直接用pycharm提供的取色器即可
		rgb(1,1,1)  可以利用截图软件获取三基色数字
		rgba(0,128,128,0.9)  最后一个数字 只能用来调节颜色的透明度

	语义
		a {
            text-decoration: none;
        }
		取消a标签默认的下划线

	背景图片 默认是铺满整个区域

	通常一个页面上的一个个的小图标 并不是单独的
	而是一张非常大的图片 该图片上有网址所用到的所有的小图标
	通过控制背景图片的位置 来显示不同的图标样式	

	边框
		border 后面写三个参数   位置没有关系
			颜色
			字体
			样式
		可以单独设置 样式 颜色 粗细
				border-top-style:dotted;
			  border-top-color: red;
			  border-right-style:solid;
			  border-bottom-style:dotted;
			  border-left-style:none;

		可以单独设置某一边的样式
			/*border-top: 3px solid red;*/
            /*border-left: 1px dotted green;*/
            /*border-right: 5px dashed blue;*/
            /*!*border-bottom: 10px solid pink;*!*/
		也可以简写统一设置
			border: solid 10px red; 

	display
		inline 将块儿级标签变成行内标签
		block  能够将行内标签 也能设置长宽和独占一行
		inline-block;  /*即可以设置长宽 也可以在一行展示*/

		display:none  隐藏标签 并且标签原来占的位置也没有了

		visibility:hidden  隐藏标签 但是标签原来的位置还在 

	盒子模型
		谷歌浏览器body默认有8px外边距
		body {
			margin:0px;
		}

		以快递盒为例
			1.两个快递盒之间的距离(标签与标签之间的距离) 				外边距(margin)
			2.快递盒盒子的厚度(边框border)      				边框(border)
			3.快递盒中的物品距离内边框的距离(内部文本与内边框之间的距离)        内边距(内填充) padding
			4.物品的大小(文本大小)							内容content

			/*margin: 15px;  !*只写一个参数 上下左右全是*!*/
            /*margin: 10px 20px;  !*第一个控制的上下  第二个是左右*!*/
            /*margin: 10px 20px 30px;  !*第一个控制的上  第二个是左右 第三个是下*!*/
            margin: 10px 20px 30px 40px;  /*上  右   下  左*/
			padding简写规律跟margin一样

		        #d1 {
            margin: 0 auto;
        }
		只能左右居中  不能上下居中			

	浮动(*****)
		float
		在 CSS 中，任何元素都可以浮动。

		浮动的元素 是脱离正常文档流的(原来的位置会让出来)

		浏览器会优先展示文本内容(******)

	浮动带来的影响
		会造成父标签塌陷(口袋瘪了)

		如何解决父标签塌陷问题？？？

	clear  清除浮动带来的影响

		.clearfix:after {
            content: '';
            clear: both;  /*左右两边都不能有浮动的元素*/
            display: block;
        }
		哪个父标签塌陷了 就给谁加clearfix这个类属性值		

	overflow溢出属性 

	定位
		所有的标签默认都是静态的 无法改变位置
		position: static;
		必须将静态的状态修改成定位之后

		相对定位(了解)   relative
			相对于标签原来的位置 移动

		绝对定位(小米的购物车)  absolute
			相对于已经定位过(只要不是static都可以 relative)的父标签 再做定位		

		固定定位(回到顶部)  fixed
			相对于浏览器窗口  固定在某个位置不动							

		位置的辩护是否脱离文档流
			1.不脱离文档流
				相对定位

			2.脱离文档流
				浮动的元素
				绝对定位
				固定定位			

	opacity
		既可以调颜色 也可以调字体