CSS 基础 笔记
Author : 朱盟 |吃火星的宝宝
TIME: 2019/6/1 学习的第6天
GIT HUB : embaobao https://github.com/embaobao/EM
Email: 1132067567@qq.com
CSDN: https://blog.csdn.net/embaobao
博客园: https://www.cnblogs.com/embaobao/
学习记录 [] 为有padding margin
块 body[] div,p[] ,h1 ,ul [, li, ol[], dl[], dt ,dd ,table[] thead tbody tfoot th[] tr td[] caption form fieldset[] legend[] hr[]
内联 em i b strong u del s sup sub br img span a input[] select option[] textarea[] button[] lable
重置样式
body,p,fieldset,legend,option,th,td,th,input,hr,button,ol,ul,dl,dd{margin:0px;padding:0px;}
/*清除默认间距 性能高与 *{margin: 0;padding: 0; }*/
h1,h2,h3,h4,h5,h6,b,strong{font-weight:normal;} /* 清除加粗效果 */
li{list-style:none;}/*清除列表图标*/
a{text-decoration:none;color:#666;}/*清除a标签下划线 字体颜色*/
i,em{font-style:normal;}/* 清除倾斜效果 */
img{border:none;display:block;}/*清除IE A 标签下图片有默认边框 和转化元素类型清除图片之间的间隙*/
input{outline:none;}/* 清除input 浏览器的有的蓝色有边框的效果 */
body{font-family:"微软雅黑'";font-size:14px; color:#666;line-height:1em ; }
/*清除有默认行高 字体 字体颜色*/
table{border-spacing:0px; /*调整相同的单元格之间的边距*/}
a:hover{text-decoration:underline} /* 标签下划线 */
标准盒子模型
margin border padding content
IE 的怪异盒子模型
在不加 <!doctype html>
IE8 以下 border |padding|都不会影响盒子的大小
组成盒子的大小由 margin+content ;
如果我想让其他浏览器都按照怪盒子来解析怎么办了?
{box-sizing:content-box;}
/* 盒子模型的标准的规则解析
盒子的大小 会