《高效整洁css代码原则（efficient and clean css code principle）》由会员上传分享，免费在线阅读，更多相关内容在教育资源-天天文库。

1、高效整洁css代码原则（EfficientandcleanCSScodeprinciple）EfficientandcleanCSScodeprinciples(upanddown)CSSitisnotdifficult,butinlargeprojects,itbecomesdifficulttomanage,especiallythedifferentpeopleintheCSSwritingstyleisslightlydifferent,theteamisevenmoredifficulttocommunicate,it

2、summarizessomehowtoachievetheCSScodeprinciple,neat:1.usingReset,butnotglobalResetThedefaultattributesofdifferentbrowserelementsaredifferent.UsingResetcanresetsomeofthedefaultattributesofbrowserelementstoachievebrowsercompatibility.Butnotice,pleasedon'tuseglobalReset:

3、*{margin:0;padding:0;}Thisisnotjustbecauseit'sslowandinefficient,butitalsocausessomeunnecessaryelementstoresetthemarginsandmargins.Inthisrecommendation,werefertothepracticesofYUIResetandEricMeyer.Clearandmargin**//**Body,H1,H2,H3,H4,H5,H6,HR,p,Blockquote,structuralel

4、ements/**/structuralelementsDL,DT,DD,UL,ol,Li,list/elementslistelements.Pre,textformatting/elementstextformatelements.Form,fieldset,legend,button,input,textarea,form/elementsformelements.Th,TD,table/elementsformelements.Img/*imgelements*/{pictureelementBorder:mediumn

5、one;Margin:0;Padding:0;}Setthedefaultfont**//**Body,button,input,select,textarea{Font:12px/1.5'song',Tahoma,Srial,Helvetica,sans-serif;}H1,H2,H3,H4,H5,H6{font-size:100%;}Em{font-style:normal;}Theelementsofthelist**//**resetUL,ol{list-style:none}Reset/**ahyperlinkelem

6、ent**/A{text-decoration:none;color:#333;}A:hover{text-decoration:underline;color:#F40;}Reset/**pictureelement**/Img{border:0px;}Resetthetableelement**//**Table{border-collapse:collapse;border-spacing:0;}2.goodnaminghabitsNodoubt,messyornosemanticnamingcode,whowillbec

7、razytosee.Justlikethiscode:.aaabb{margin:2px;color:red;}Idon'tthinkevenbeginnerscannameaclassinarealproject,buthaveyoueverthoughtthatit'salsoproblematic?:

MynameisWiky

8、enthestylewillbechanged:.red{color:bule;}Thiskindofnamingcanbeconfusing,andthesamesidebarcalled.LeftBarcanalsobetroublesomeifyounee