html css笔记 -度一

"""浏览器shell  内核外表    心里IE              tridentFirefox         Geckogoogle chrome   webkit/blinksafari          webkitopera           prestocss 权重!important > 行间样式 > id > class | 属性 > 标签选择器 > 通配符！important      Infinity  正无穷行间样式          1000id               100class|属性|伪类   10标签|伪元素       1通配符           01000和100   256进制一位工程师手测试出来的浏览器父子选择器的内部原理是由右到左查找设置字体大小其实是设置字体的高三角形用的是border设置段落 text-indent: 2em;1em = 1 * font-size1.行级元素/内联标签  display:inlinefeature:内容决定元素所占位置        不能够经过css改变宽高    span strong em a del2.块级元素  display:blockfeature:独占一行        能够经过css改变宽高    div p ul li ol form address3.行级块元素  inline-blockfeature:内容决定大小        能够改宽高    img凡是带有inline的元素，都有文字特性代码压缩，去掉了空格回车，因此img不能用margin调节间距先定义功能（先写CSS）很是重要！em能够自定义功能a标签去掉下划线:text-decoration:none;ui标签去掉圆点:list-style:none;    padding:0;    margin:0;通配符用法初始化标签*{    padding:0;    margin:0;    text-decoration:none; ?    list-style:none;      ?}盒子模型盒子三大部分盒子壁  border内边距  padding外边距  margin盒子内容 width + heightpadding : 四个参数：上 右 下 左  三个参数：上 左右 下 两个参数：上下 左右 一个参数：全都有body的margin 默认为8pxposition        absolute            脱离原来位置进行定位            至关于最近的有定位的父级进行定位            若是没有，那么相对于文档进行定位        relative            保留原来位置进行定位            至关于本身自己原来的位置进行定位        fixed            固定定位用relative做为位置，用absolute进行定位居中：html:<div></div>css:div{    positoin:absolute/fixed; a..相对于文档中间 f..相对于浏览器中间    left:50%;    top:50%;    width:100px;    height:100px;        margin-left:-50px;width * 0.5    margin-top:-50px;height * 0.5}z-index:*; position 层的优先显示border-radius:50%  能够把方块变成圆圈浮动元素产生了浮动流全部产生了浮动流的元素，块级元素看不到他们产生了bfc的元素和文本类属性（inline）的元素以及文本都能看到浮动元素利用伪元素让父级包裹住浮动元素clear:both必须是块级元素伪元素必须加上content才能生效原型继承圣杯模式:"""