Sepuluh peretasan CSS terbaik dalam pertukaran web production_Experience

 Jika anda pengekod depan anda mesti tahu bagaimana penting untuk membuat semak imbas silang, CSS dan xHTML kod yang sah. Dan juga anda mesti tahu berapa masa yang kita luangkan dalam semua godam dan pembetulan untuk pelbagai pelayar. Saya telah menulis tentang beberapa daripadanya lebih awal mengenai isu ketelusan PNG, Medan Kuning dalam borang web, Jajaran menegak, pembahagian dan sebagainya. Kod CSS dan juga jimat sedikit masa.

1. Vertical align div  (垂直居中)

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

2. Min-Ketinggian  (最小高度)

pemilih {
min-tinggi:500px;
tinggi:auto; !penting
tinggi:500px;
}

3. PNG transparency  (透明png)

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

4. Autoclear (自动清除)

.bekas:selepas {
kandungan: “.”;
paparan: sekat;
tinggi: 0;
jelas: kedua-duanya;
keterlihatan: tersembunyi;
}
.bekas {display: inline-table;}
/* Sembunyi dari IE-mac */
* html .container {height: 1%;}
.container {display : sekat;}
/* Tamatkan sembunyi dari IE-mac */

5. Tetapkan semula 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; padding:0;
}
jadual {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:before,q:after {content:”;}

6. Menatal Render IE  (IE滚动条渲染)

html {
latar belakang : url(null) ditetapkan tidak berulang;
}

7. Kelegapan (透明度)

#transdiv {
penapis:alpha(opacity=75);
-moz-opacity:.75;
kelegapan:.75;
}

8. PRE Tag (标签预格式)

pra {
white-space: pra-bungkus; /* css-3 */
white-space: -moz-pre-wrap !important; /* Mozilla, sejak 1999 */
ruang putih: -pra-bungkus; /* Opera 4-6 */
ruang putih: -o-pra-bungkus; /* Opera 7 */
word-wrap: break-word; /* Internet Explorer 5.5+ */
}

9. Li Latar Belakang Ulang IE (LI标签背景重复)


#leftnav li { zoom: 1;} /* haslayout=true >



10. Baik untuk tahu  (最好知道的)

@charset “UTF-8″;

/* ———————————————————————-
WinIE7
———————————— ————————————- */
*:pemilih+html anak pertama{property:value;}

/* —————————— —————————————-
WinIE6 & Mac IE
———————————————————————- */
* html pemilih{property:value;}

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

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