乙個不起眼的屬性,卻包含著許多不為人知的秘密。。。
>
>
charset
="utf-8"
>
>
inlinetitle
>
>
span
.c1.c2
.c3.c5
style
>
head
>
>
>
class
="c1"
>
inline box xfg中文span
>
class
="c2"
>
inline boxspan
>
class
="c3"
>
inline boxspan
>
inline box
class
="c5"
>
inline boxspan
>
div>
body
>
html
>
效果如下:
我們發現:行高不同,但是渲染的高度是一樣的,這是為什麼呢?
行高的構成:
總結:字型背景色:
style
="border
:solid 1px red;
">
style
="background
:blue;
color
:#fff;
font-size
:20px;
line-height
:60px;
">
居中xfg
span
>
div>
執行效果:
分析:span上字型大小為20px,而line-height 為60px,明顯60px比20px大,那麼大的話多餘部分均勻分布到兩側。
進一步思考:
平常我們在乙個div中寫文字居中一般這樣寫:
#div1
其實本質上能夠居中的原因還是line-height起的作用,只不過把height和line-height設定為同等高,讓他倆吻合而已。。
文字對齊可以通過vertical-align來調整,預設是基於基線調整。
經典的3px空白問題:
下面有空白(空白大小視字型大小而定)。例如字型大小為12px,則空白為3px。因為為inline元素,遵守行高的構成,預設對齊方式為基線,所以底部會有空白空隙。
解決方案:使用底部對齊。 vertical-align: bottom;
style
="background
:red
">
>
文字span
>
src=
"test.png"
/>
div>
DataGridView設定行高
net中datagridview控制項如何設定行高 在datagridview控制項中,預設的行高很大,而標題頭的行高卻很小,感覺很不勻稱。標題頭的行高比較好設定 需要修改兩個屬性 1修改columnheadersheader 設定為你想要的高度,比如20 但這時候自動變回來。2修改columnhe...
改變QTableWidget 行高
方法一 int wide m pfieldtable columnwidth 0 int nrow m pfieldtable rowcount for int i 0 i 必須得setcolumnwidth和setrowheight一起使用才能改變行高,這兩個函式在qtableview中。方法二 ...
poi設定行高
這裡記錄下使用poi設定行高的方法。excel中的行高單位 px是相對長度,表示pixel 畫素 是螢幕上顯示資料的最基本的點。pt是絕對長度,表示point 磅 是印刷行業常用單位,等於1 72英吋。dpi 或ppi 表示解析度,即pixel dot per inch,每英吋的畫素 點 數。poi...