De flesta av de oerfarna CSS designers inser inte vikten av att skapa en "reset.css" fil. Olika webbläsare process kod annorlunda. Vilka kan se perfekt ut i Firefox, kan vara avstängda i Internet Explorer. Det finns många CSS Återställer alla via Internet att hjälpa till att bekämpa webbläsare problem. Det stora problemet med att använda en av de många befintliga ramar är att de inte är anpassade specifikt för dig.

Nu är det tid till skapa din egen fil anpassade återställa. I den här guiden hittar du Hur du skapar din egen Enkel Reset.css filen för din kommande sajt projektet. Jag hoppas att ni kommer att njuta av den här guiden.

Steg: 1 Ta bort marginal och padding element

  html, body, div, span, H1, H2, H3, H4, H5, H6, blockquote, pre, em,  
  font, img, små, starka, sub, sup, ul, ol, li, dl, dt, dd, fieldset, form,  
  label, legend, tr, th, td, input, select, textarea 

  ; padding : 0 ;  border : 0 ; outline : 0 ; } (Margin: 0; padding: 0; border: 0; outline: 0;) 

Steg 2 Återställ typografiska stilar:

  H1, H2, H3, H4, H5, H6 
  ( 
  % ; font-size: 100%; 
  ) 
  em 
  ( 
  ; font-style: italic; 
  ) 
  stark 
  ( 
  ; font-weight: bold; 
  ) 

Steg: 3 Återställ onumrerade listor:

  ul, ol 
  ( 
  ; list-style-type: none; 
  ) 

Steg 4 Gör dig av gränser:

  img, fieldset 
  ( 
  border: 0; 
  ) 

Här är vår Final Enkel Reset.css fil.

 margin : 0 ; padding : 0 ;  border : 0 ; outline : 0 ; } h1, h2, h3, h4, h5, h6 { font-size : 100 % ; } em { font-style : italic ; } strong { font-weight : bold ; } ul, ol { list-style : none ; } img, fieldset { border : 0 ; } a { color : # 333333 ; text-decoration : none ; } a :hover { text-decoration : underline ; } html, body, div, span, H1, H2, H3, H4, H5, H6, blockquote, pre, em, font, img, små, starka, sub, sup, ul, ol, li, dl, dt, dd, fieldset, form, label, legend, tr, th, td, input, select, textarea (margin: 0; padding: 0; border: 0; outline: 0;) H1, H2, H3, H4, H5, H6 (font -size: 100%;) em (font-style: italic;) strong (font-weight: bold;) ul, ol (list-style: none;) img, fieldset (border: 0;) a (color: # 333333; text-decoration: none;) a: hover (text-decoration: underline;) 

Slutsats

Dessa är bara några av de tips som hjälper mig att skriva bättre kod. Jag hoppas att handledning också hjälper dig att skriva bättre och ren kod. Använd dessa tips för att din nuvarande och nästa projekt, och du kommer säkert uppskattar de ansträngningar.

Om du tror att handledning kan vara bättre, Vänligen dela med oss. Kommentar oss

Om du vill få mer handledning från oss, vänligen överväga att prenumerera på vårt foder genom RSS eller e-post.

Filed under: Css, Tutorials av admin