不僅不同瀏覽器不同,不同的字體,不同的文字大小也會(huì)表現(xiàn)不一樣。
重置 form checkbox & radio
因?yàn)椴煌瑸g覽器解析不一樣,有些是默認(rèn)margin,有些是默認(rèn)padding,還有ie6,7連margin和padding即使設(shè)置為0后,所占的空間還是比較大,所以還是有必須重置下,這樣就能解決很多不必要的麻煩。
以下是 14px Arial 字體的解決方案:
1、css代碼
.form { font: 14px/18px Arial, Helvetica, sans-serif; }.form input, .form label { vertical-align: middle; }.form label { margin-right: 6px; }.form_checkbox, .form_radio { margin: 0 3px 0 0;/*與右側(cè)文字的間距*/ padding: 0; width: 13px; height: 13px; /*ie7 ie6 根據(jù)不同的 font-size 設(shè)置不同的值*/ *vertical-align: 1px;}
2、html代碼
<form name="form1" method="post" action="" class="form"> <p> <input type="checkbox" name="checkbox4" id="checkbox4" class="form_checkbox"> <label for="checkbox4">checkbox4</label> <input type="checkbox" name="checkbox5" id="checkbox5" class="form_checkbox"> <label for="checkbox5">checkbox5</label> <input type="checkbox" name="checkbox6" id="checkbox6" class="form_checkbox"> <label for="checkbox6">checkbox6</label> </p> <p> <input type="radio" name="radio" id="radio4" value="radio4" class="form_radio"> <label for="radio4">radio4</label> <input type="radio" name="radio" id="radio5" value="radio5" class="form_radio"> <label for="radio5">radio5</label> <input type="radio" name="radio" id="radio6" value="radio6" class="form_radio"> <label for="radio6">radio6</label> </p></form>
3、效果圖
以上就是本文的全部?jī)?nèi)容,希望本文的內(nèi)容對(duì)大家的學(xué)習(xí)或者工作能帶來一定的幫助,同時(shí)也希望多多支持武林網(wǎng)!
新聞熱點(diǎn)
疑難解答
圖片精選