1. 程式人生 > >html+css個人樣式reset.css

html+css個人樣式reset.css

承接第一篇提過的規則:元素表現為瀏覽器預設樣式,而編者可以設定屬於自己的元素樣式,以下是個人習慣總結(間斷式更新)。

@charset 'utf-8';
body{color:#000;background:#FFF;font-family:'Microsoft YaHei',sans-serif,Arial;}
html,body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,code,form,fieldset,legend,input,button,textarea,p,blockquote,th,td,strong{padding:0;margin:0;
 box-sizing: border-box;}
table{border-collapse:collapse;border-spacing:0;}
img{border:0;}

a{text-decoration:none;   color:inherit;   outline:none;}
a:hover{text-decoration:none;}
var,em,strong{font-style:normal;}
em,strong,th,var{font-style:inherit;font-weight:inherit;}
li{list-style:none;}
caption,th{text-align:left;}
h1,h2,h3,h4,h5,h6{font-size:100%;font-weight:normal;}
input,button,textarea,select,optgroup,option{font-family:inherit; font-size:inherit;font-style:inherit;font-weight:inherit;}
input,button,textarea,select{*font-size:100%;}

dd{margin-inline-start:0px;}

.fl{float: left;}
.fr{float: right;}

.clearfix:after{content:"";clear: both;display: block;height: 0px;visibility: hidden;}
.clearfix {*zoom: 1;}

.pr{position:relative;}
.pa{position: absolute;}

.centre{position: absolute;top: 50%;left: 50%;transform: translate(-50%,-50%);}

.hid{visibility: hidden;}

.tc{text-align: center;}
.vm{vertical-align: middle;}

.lh1{line-height: 1;}
.lh112{line-height: 1.12;}
.lh15{line-height: 1.5;}

.omit{overflow: hidden;text-overflow:. ellipsis;white-space: nowrap;}

.multi{overflow: hidden;text-overflow:hidden;display: -webkit-box;-webkit-box-orient: vertical;/*-webkit-line-clamp: 3;此行在css中設定*/}

.mirror{transform: scaleX(-1);filter: FlipH;}

.fb{font-weight: bold;}


/*foot固定在螢幕底部*/
/*css*/
/*html,body{height: 100%;margin: 0;padding: 0;}
.wrap{height: 100%; margin-bottom: -100px;background: #0000FF;}
.foot{height: 100px;background: #008000;}*/
/*html*/
/*<div class="wrap">
	<div class="head"></div>
	<div class="con"></div>
</div>
<div class="foot"></div>*/


以上內容為本人自行探索,難免錯漏。寫出來一方面用於交流,另一方面期盼高手過路能隨意指點兩手,指出本人理解有誤之處,不勝感激!