Efficient CSS Code (1)

--Read notes, Welcome to error correction

Usually write CSS two commonly used CSS document (small miscellaneous feeling with pretty like, also read some books, try to use the effect is good)

/************CSS Reset *********/

/******** as the name implies CSS tag Reset, do not change, suitable for beginners, small miscellaneous is also a beginner, after the initialization of the individual tags will not appear some unexpected results, but also for the compatibility of the various browsers to consider *****/

BODY,DIV,DL,DT,DD,UL,OL,LI,H1,H2,H3,H4,H5,H6,PRE,FORM,FIELDSET,INPUT,TEXTAREA,P,BLOCKQUOTE,TH,TD{margin:0;padding:0; }Table{Border-collapse:collapse;border-spacing:0; }fieldset,img{Border:0; }Address,caption,cite,code,dfn,em,strong,th,var{Font-style:Normal;Font-weight:Normal; }Ol,ul{List-style:None; }caption,th{text-align: Left; }H1,h2,h3,h4,h5,h6{font-size:100%;Font-weight:Normal; }Q:before,q:after{content:"'; }

/********css base*********/

/*******CSS basic layer, how to use to see the individual, small miscellaneous each use is to see what the page needs to join, can be used for CSS combinations, usually have these, these are the notes after reading ****/

/*Text Layout*/. F12{font-size:12px;}. F13{font-size:13px;}. F14{font-size:14px;}. F16{font-size:16px;}. F20{font-size:20px;}. FB{Font-weight:Bold;}. Fn{Font-weight:Normal;}. T2{text-indent:2em;}. lh150{Line-height:150%;}. lh180{Line-height:180%;}. lh200{Line-height:200%;}. UNL{text-decoration:Underline;}. NO_UNL{text-decoration:None;}/*positioning*/. TL{text-align: Left;}. TC{text-align:Center;}. TR{text-align: Right;}. BC{Margin-left:Auto;Margin-right:Auto;}. FL{float: Left;Display:inline;}. Fr{Folat: Right;Display:inline;}. CB{Clear:both;}. CR{Clear: Right;}. CL{Clear: Left;}/*Clearfix is to clear the child element floating in the parent container, so that the parent container of the floating element can adaptively height according to the height of the floating element, and the Clearfix is hung on the parent container .*/. Clearfix:after{content:'. ';Display:Block;Height:0;Clear:both;Visibility:Hidden;}. Clearfix{Display:Inline-block}*html.clearfix{Height:1%;}. Clearfix{Display:Block;}. VM{vertical-align:Middle;}. PR{position:relative;}. PA{position:Absolute;}. PF{position:fixed;}. Abs-right{position:Absolute; Right:0;}/*This character I haven ' t uesd*/. Zoom{Zoom:1;} /* For the start of layout */. Hidden{Visibility:Hidden;}. None{Display:None;}/*Width Height*/. W10{width:10px;}. W20{width:20px;}. W30{width:30px;}. W40{width:40px;}. W50{width:50px;}. W60{width:60px;}. W70{width:70px;}. W80{width:80px;}. W90{width:90px;}. w100{width:100px;}. w200{width:200px;}. w250{width:250px;}. w300{width:300px;}. w400{width:400px;}. W500{width:500px;}. w600{width:600px;}. w700{width:700px;}. w800{width:800px;}. W{width:100%}. H50{Height:50px;}. H80{Height:80px;}. H100{Height:100px;}. h200{Height:200px;}. h{Height:100%;}/*margin padding*/. M10{margin:10px;}. M15{margin:15px;}. M30{margin:30px;}. MT5{Margin-top:5px;}. Mt10{Margin-top:10px;}. mt15{Margin-top:15px;}. mt20{Margin-top:20px;}. Mt30{Margin-top:30px;}. Mt50{Margin-top:50px;}. mt100{Margin-top:100px;}. Mb5{Margin-bottom:5px;}. MB10{Margin-bottom:10px;}. Mb15{Margin-bottom:15px;}. Mb20{Margin-bottom:20px;}. Mb30{Margin-bottom:30px;}. Mb50{Margin-bottom:50px;}. mb100{Margin-bottom:100px;}. MR5{Margin-right:5px;}. Mr10{Margin-right:10px;}. Mr15{Margin-right:15px;}. Mr20{Margin-right:20px;}. Mr30{Margin-right:30px;}. Mr50{Margin-right:50px;}. mr100{Margin-right:100px;}. ML5{Margin-left:5px;}. Ml10{Margin-left:10px;}. Ml15{Margin-left:15px;}. Ml20{Margin-left:20px;}. Ml30{Margin-left:30px;}. Ml50{Margin-left:50px;}. ml100{Margin-left:100px;}. P10{padding:10px;}. P15{padding:15px;}. P30{padding:30px;}. Pt5{Padding-top:5px;}. Pt10{Padding-top:10px;}. pt15{Padding-top:15px;}. pt20{Padding-top:20px;}. Pt30{Padding-top:30px;}. Pt50{Padding-top:50px;}. PB5{Padding-bottom:5px;}. PB10{Padding-bottom:10px;}. Pb15{Padding-bottom:15px;}. Pb20{Padding-bottom:20px;}. Pb30{Padding-bottom:30px;}. Pb50{Padding-bottom:50px;}. pb100{Padding-bottom:100px;}. PL5{Padding-left:5px;}. Pl10{Padding-left:10px;}. Pl15{Padding-left:15px;}. Pl20{Padding-left:20px;}. Pl30{Padding-left:30px;}. Pl50{Padding-left:50px;}. pl100{Padding-left:100px;}. PR5{Padding-right:5px;}. Pr10{Padding-right:10px;}. Pr15{Padding-right:15px;}. Pr20{Padding-right:20px;}. Pr30{Padding-right:30px;}. Pr50{Padding-right:50px;}. pr100{Padding-right:100px;}

Efficient CSS Code (1)