Box Model與控制項樣式

2021-10-12 01:49:51 字數 1787 閱讀 6466

一、box model樣式

1、當使用style sheets的時候,所有的控制項都被當做是有4個同心矩形組成的方框模型。即:

2、marginborder-widthpadding預設值都是 0,所以預設情況下,這四個矩形是重疊的。

3、background-colorbackground-image等屬性都是作用在border rectangle這個範圍的矩形中的,margin rectangle寬度的部分不包含在內。

二、不同方框模型使用

1、最外層的margin rectangle

該屬性可以指定margin的寬度,可以預設一起指定,也可以單獨指定。

如:btn01btn02相同,指定btn01margin寬度為20px。

此時等價於依次預設margin-top,margin-right,margin-bottom,margin-left都是20px的寬度。

2、次外層的border rectangle應用示例,如設定qpushbutton的一些對應border屬性

3、填充矩形padding rectangle該屬性可以指定填充的寬度,如指定的寬度太大的話,可能會留給content顯示的控制項就很少,導致內容只能顯示出一部分。如當指定btn01的對應padding很大時,其內容將會有一部分被遮擋。

分別設定不同位置的padding時,會導致content的大小發生變化。

ui.btn01-

>

setstylesheet

("qpushbutton#btn01 ");

ui.btn02-

>

setstylesheet

("qpushbutton#btn02 "

);

控制項 應用css樣式

html view plain copy print?asp menu id mnutopmenu runat server dynamicenabledefaultpopoutimage false dynamichorizontaloffset 1 font bold false orienta...

SWT常用控制項樣式

label seperator 該label作為乙個分隔符,此時不能向該label物件設定文字或 horizontal 當作為分隔符時,該分隔符為水平 vertical 當作為分隔符時,該分隔符為垂直 shadow in 當作為分隔符時,該分隔符凹陷 shadow out 當作為分隔符時,該分隔符凸...

視窗和控制項樣式參考

用作查閱 原帖 http blog.csdn.net vsirsoft archive 2008 12 25 3601714.aspx 控制項樣式參考列表 es left 左對齊 es center 居中對齊 es right 右對齊 es multiline 多行 es uppercase 全部大...