關於單核取方塊與文字對齊的小總結

2021-05-23 13:09:03 字數 705 閱讀 3076

ps,英文和14號字的中文對齊是良好的,不需要另外加樣式。但可憐我們的**是以12號中文為王,於是我們的悲劇出現了。

第一:不管他

第二:單核取方塊margin值清零,單核取方塊加上vertical-align:middle; margin-top:-2px; margin-bottom:1px;樣式。這種方式在各個瀏覽器中都還過得去,至少我現在還沒發現什麼問題。**也增加得不多,值得推薦。

第三,人人網上採用了單核取方塊margin不清零,vertical-align:middle;margin-top:-3px;的方法,可以緩和一下,但是貌似它現在也沒用了。

第四:這是個比較極品的方法,學的別人的,但那位高手是誰我卻想不起來了。他覺得既然是中文字型的對齊方式在作祟,乾脆就把字型設為英文,但是顯示還是照樣是中文。

單核取方塊margin值清零,vertical-align:middle,後面的文字用label或span標籤包將起來,設定字型為tahome一類的英文本型,vertical-align:middle。說實話,這個方法的結果並不比第二種優秀,**用得更多,在這裡提出來主要是想向這位仁兄表示敬意,他的創造力非凡。

此外,還有其他一些方法,例如vertical-align基於baseline的,top的,bottom的,但是這些或多或少表現得有些問題,在這裡就不推薦了。網上還有仁兄提出用浮動對齊的方式,這個方法懂一點css的都會想到,但是懂兩點css的就不會用它,原因很簡單:太麻煩,何必呢。

核取方塊或單選框與文字對齊的問題

單選框 核取方塊 當文字14px左右大小時,對齊良好 單選框 核取方塊 當文字12px左右大小時,文字的位置就偏下了,火狐瀏覽器和谷歌瀏覽器下尤為明顯 單選框 核取方塊 當文字12px左右大小時,單 復 選框設定vertical align text bottom margin bottom 2px...

核取方塊單選框與文字對齊問題的研究與解決

前言 目前中文 上面的文字,就我的個人感覺而言,絕大多數 的主流文字大小為12px,因為在目前高解析度顯示器螢幕下,11px的漢字,其畫素點開始不規整,文字不如12px來的顯示良好。12px大小的文字就是主流也是底線。然而12px的文字與單選框和核取方塊是不對齊的。例如下面這張雅虎中國首頁在火狐瀏覽...

jquery操作核取方塊的總結

1 獲取單個checkbox選中項 三種寫法 input checkbox checked val 或者 input type checkbox checked val 或者 input name ck checked val 2 獲取多個checkbox選中項 input checkbox eac...