甯歌鍏煎闂錛?/span>
1.DOCTYPE 褰卞搷 CSS 澶勭悊
2.FF: div 璁劇疆 margin-left, margin-right 涓?auto 鏃跺凡緇忓眳涓? IE 涓嶈
3.FF: body 璁劇疆 text-align 鏃? div 闇瑕佽緗?margin: auto(涓昏鏄?margin-left,margin-right) 鏂瑰彲灞呬腑
4.FF: 璁劇疆 padding 鍚? div 浼氬鍔?height 鍜?width, 浣?IE 涓嶄細, 鏁呴渶瑕佺敤 !important 澶氳涓涓?height 鍜?width
5.FF: 鏀寔 !important, IE 鍒欏拷鐣? 鍙敤 !important 涓?FF 鐗瑰埆璁劇疆鏍峰紡
6.div 鐨勫瀭鐩村眳涓棶棰? vertical-align:middle; 灝嗚璺濆鍔犲埌鍜屾暣涓狣IV涓鏍烽珮 line-height:200px; 鐒跺悗鎻掑叆鏂囧瓧錛屽氨鍨傜洿灞呬腑浜嗐傜己鐐規槸瑕佹帶鍒跺唴瀹逛笉瑕佹崲琛?br />
7.cursor: pointer 鍙互鍚屾椂鍦?IE FF 涓樉紺烘父鏍囨墜鎸囩姸錛?hand 浠?IE 鍙互
8.FF: 閾炬帴鍔犺竟妗嗗拰鑳屾櫙鑹詫紝闇璁劇疆 display: block, 鍚屾椂璁劇疆 float: left 淇濊瘉涓嶆崲琛屻傚弬鐓? menubar, 緇?a 鍜?menubar 璁劇疆楂樺害鏄負浜嗛伩鍏嶅簳杈規樉紺洪敊浣? 鑻ヤ笉璁?height, 鍙互鍦?menubar 涓彃鍏ヤ竴涓┖鏍箋?br />
9.鍦╩ozilla firefox鍜孖E涓殑BOX妯″瀷瑙ｉ噴涓嶄竴鑷村鑷寸浉宸?px瑙ｅ喅鏂規硶錛?
div{margin:30px!important;margin:28px;}
娉ㄦ剰榪欎袱涓猰argin鐨勯『搴忎竴瀹氫笉鑳藉啓鍙嶏紝鎹樋鎹風殑璇存硶!important榪欎釜灞炴E涓嶈兘璇嗗埆錛屼絾鍒殑嫻忚鍣ㄥ彲浠ヨ瘑鍒傛墍浠ュ湪IE涓嬪叾瀹炶В閲婃垚榪欐牱錛?
div{maring:30px;margin:28px}
閲嶅瀹氫箟鐨勮瘽鎸夌収鏈鍚庝竴涓潵鎵ц錛屾墍浠ヤ笉鍙互鍙啓margin:XXpx!important;10.IE5 鍜孖E6鐨凚OX瑙ｉ噴涓嶄竴鑷?br /> IE5涓?
div{width:300px;margin:0 10px 0 10px;}
div鐨勫搴︿細琚В閲婁負300px-10px(鍙沖～鍏?-10px(宸﹀～鍏?鏈緇坉iv鐨勫搴︿負280px錛岃屽湪IE6鍜屽叾浠栨祻瑙堝櫒涓婂搴﹀垯鏄互300px+10px(鍙沖～鍏?+10px(宸﹀～鍏?=320px鏉ヨ綆楃殑銆傝繖鏃舵垜浠彲浠ュ仛濡備笅淇敼
div{width:300px!important;width /**/:340px;margin:0 10px 0 10px}
鍏充簬榪欎釜/**/鏄粈涔堟垜涔熶笉澶槑鐧斤紝鍙煡閬揑E5鍜宖irefox閮芥敮鎸佷絾IE6涓嶆敮鎸侊紝濡傛灉鏈変漢鐞嗚В鐨勮瘽錛岃鍛婅瘔鎴戜竴澹幫紝璋簡錛侊細錛?br />
11.ul鏍囩鍦∕ozilla涓粯璁ゆ槸鏈塸adding鍊肩殑,鑰屽湪IE涓彧鏈塵argin鏈夊兼墍浠ュ厛瀹氫箟
ul{margin:0;padding:0;}
灝辮兘瑙ｅ喅澶ч儴鍒嗛棶棰?br />
娉ㄦ剰浜嬮」錛?/span>
1銆乫loat鐨刣iv涓瀹氳闂悎銆?br />
渚嬪錛?鍏朵腑floatA銆乫loatB鐨勫睘鎬у凡緇忚緗負float:left;)
<#div id="floatA" ></#div>
<#div id="floatB" ></#div>
<#div id="NOTfloatC" ></#div>
榪欓噷鐨凬OTfloatC騫朵笉甯屾湜緇х畫騫崇Щ錛岃屾槸甯屾湜寰涓嬫帓銆?br />
榪欐浠ｇ爜鍦↖E涓鏃犻棶棰橈紝闂鍑哄湪FF銆傚師鍥犳槸NOTfloatC騫墮潪float鏍囩錛屽繀欏誨皢float鏍囩闂悎銆?br />
鍦?
<#div id="floatB" ></#div>
<#div id="NOTfloatC" ></#div>
<#div class="floatB"></#div>
<#div class="NOTfloatC"></#div>
涔嬮棿鍔犱笂
<#div class="NOTfloatC"></#div>
<#div class="clear"></#div>
榪欎釜div涓瀹氳娉ㄦ剰澹版槑浣嶇疆錛屼竴瀹氳鏀懼湪鏈鎭板綋鐨勫湴鏂癸紝鑰屼笖蹇呴』涓庝袱涓叿鏈塮loat灞炴х殑div鍚岀駭錛屼箣闂翠笉鑳藉瓨鍦ㄥ祵濂楀叧緋伙紝鍚﹀垯浼氫駭鐢熷紓甯搞?br />
騫朵笖灝哻lear榪欑鏍峰紡瀹氫箟涓轟負濡備笅鍗沖彲錛?
.clear{
clear:both;}
姝ゅ錛屼負浜嗚楂樺害鑳借嚜鍔ㄩ傚簲錛岃鍦╳rapper閲岄潰鍔犱笂overflow:hidden;clear:both;}
褰撳寘鍚玣loat鐨刡ox鐨勬椂鍊欙紝楂樺害鑷姩閫傚簲鍦↖E涓嬫棤鏁堬紝榪欐椂鍊欏簲璇ヨЕ鍙慖E鐨刲ayout縐佹湁灞炴?涓囨伓鐨処E鍟婏紒)鐢▃oom:1;鍙互鍋氬埌錛岃繖鏍峰氨杈懼埌浜嗗吋瀹廣?br /> 渚嬪鏌愪竴涓獁rapper濡備笅瀹氫箟錛?
.colwrapper{
overflow:hidden;
zoom:1;
margin:5px auto;}
overflow:hidden;
zoom:1;
margin:5px auto;}
2銆乵argin鍔犲嶇殑闂銆?br />
璁劇疆涓篺loat鐨刣iv鍦╥e涓嬭緗殑margin浼氬姞鍊嶃傝繖鏄竴涓猧e6閮藉瓨鍦ㄧ殑bug銆?br /> 瑙ｅ喅鏂規鏄湪榪欎釜div閲岄潰鍔犱笂display:inline;
渚嬪錛?br />
<#div id="imfloat"></#div>
鐩稿簲鐨刢ss涓?br />
#IamFloat{
float:left;
margin:5px;/*IE涓嬬悊瑙ｄ負10px*/
display:inline;/*IE涓嬪啀鐞嗚В涓?px*/}
float:left;
margin:5px;/*IE涓嬬悊瑙ｄ負10px*/
display:inline;/*IE涓嬪啀鐞嗚В涓?px*/}
3銆佸叧浜庡鍣ㄧ殑鍖呮兜鍏崇郴
寰堝鏃跺欙紝灝ゅ叾鏄鍣ㄥ唴鏈夊鉤琛屽竷灞錛屼緥濡備袱銆佷笁涓猣loat鐨刣iv鏃訛紝瀹藉害寰堝鏄撳嚭鐜伴棶棰樸傚湪IE涓紝澶栧眰鐨勫搴︿細琚唴灞傛洿瀹界殑div鎸ょ牬銆備竴瀹氳鐢≒hotoshop鎴栬匜irework閲忓彇鍍忕礌綰х殑綺懼害銆?br />
4銆佸叧浜庨珮搴︾殑闂
濡傛灉鏄姩鎬佸湴娣誨姞鍐呭錛岄珮搴︽渶濂戒笉瑕佸畾涔夈傛祻瑙堝櫒鍙互鑷姩浼哥緝錛岀劧鑰屽鏋滄槸闈欐佺殑鍐呭錛岄珮搴︽渶濂藉畾濂姐傦紙浼間箮鏈夋椂鍊欎笉浼氳嚜鍔ㄥ線涓嬫拺寮錛屼笉鐭ラ亾鍏蜂綋鎬庝箞鍥炰簨錛?br />
5銆佹渶鐙犵殑鎵嬫 - !important;
濡傛灉瀹炲湪娌℃湁鍔炴硶瑙ｅ喅涓浜涚粏鑺傞棶棰?鍙互鐢ㄨ繖涓柟娉?FF瀵逛簬"!important"浼氳嚜鍔ㄤ紭鍏堣В鏋?鐒惰孖E鍒欎細蹇界暐.濡備笅
.tabd1{
background:url(/res/images/up/tab1.gif) no-repeat 0px 0px !important; /*Style for FF*/
background:url(/res/images/up/tab1.gif) no-repeat 1px 0px; /* Style for IE */}
鍊煎緱娉ㄦ剰鐨勬槸錛屼竴瀹氳灝唜xxx !important 榪欏彞鏀劇疆鍦ㄥ彟涓鍙ヤ箣涓婏紝涓婇潰宸茬粡鎻愯繃
background:url(/res/images/up/tab1.gif) no-repeat 0px 0px !important; /*Style for FF*/
background:url(/res/images/up/tab1.gif) no-repeat 1px 0px; /* Style for IE */}
]]>