Les dix meilleurs hacks CSS pour la création Web

 Si vous êtes un codeur front end , vous devez savoir à quel point il est important de créer des navigations croisées, un code CSS et xHTML valide. Et vous devez savoir combien de temps nous passons dans tous ces piratages et correctifs pour divers navigateurs. J'ai écrit sur certains d'entre eux plus tôt sur les problèmes de transparence PNG, les champs jaunes sous forme Web, l'alignement vertical div etc. 

Voici la liste de 10 hacks et astuces CSS triés Code CSS et gagnez également du temps. 

1. Alignement vertical div  (垂直居中) 

http:/ 
* sélecteur html{property:value;} 
/*stylizedweb.com/2008/02/01/vertical-align-div/ 

2. Min-Height  (最小高度) 

sélecteur { 
min-height:500px ; 
hauteur : auto ; !important 
hauteur : 500 px ; 
} 

3. PNG transparence  (透明png) 

http://stylizedweb.com/2007/12/30/png-transparency-issues/ 

4. Effacement automatique (自动清除) 

.container:after { 
content : "." ; 
affichage : bloquer ; 
hauteur : 0 ; 
clair : les deux ; 
visibilité : masquée ; 
} 
.container {display : inline-table;} 
/* Se cache de IE-mac */ 
* html .container {hauteur : 1%;} 
.container {display : block;} 
/* Fin masquer sur IE-mac */ 

5. Réinitialiser CSS  (CSS重设) 

body,div,dl,dt,dd,ul,ol,li,h1,h2,h3,h4,h5,h6,pre,form, 
fieldset, input,p,blockquote,th,td { 
margin:0; remplissage : 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%;} 
q :avant,q:après {content:”;} 

6. Défilement Rendu IE  (IE滚动条渲染) 

html { 
arrière-plan  : url(null) fixé sans répétition ; 
} 

7. Opacité (透明度) 

#transdiv { 
filter:alpha(opacity=75); 
-moz-opacité : 0,75 ; 
opacité : 0,75 ; 
} 

8. PRE Tag (标签预格式) 

pre { 
espace blanc : pre-wrap ; /* css-3 */ 
espace blanc : -moz-pre-wrap !important; /* Mozilla, depuis 1999 */ 
white-space : -pre-wrap; /* Opera 4-6 */ 
espace blanc : -o-pre-wrap; /* Opera 7 */ 
word-wrap : break-word ; /* Internet Explorer 5.5  */ 
} 

9. Li Arrière-plan Répéter IE (LI标签背景重复) 

 
 
 

10. Bon à savoir  (最好知道的) 

@charset « UTF-8″ ; 

/* ———————————————————————- 
WinIE7 
——————————— ————————————- */ 
*:sélecteur HTML du premier enfant{property:value;} 

/* ——————————— ————————————- 
WinIE6 et Mac IE 
———————————————————————- */ 
* sélecteur html{property:value;} 

/* ———————————————————————- 
WinIE6 
———————————————————————- */ 
/***/ 

/* ————— ——————————————————- 
MacIE 
———————————————————————- */ 
/***/ 
selector{property:value;}
/**/

Plus des dix meilleurs hacks CSS pour créer des pages Web articles, veuillez faire attention au site Web PHP chinois !