Qt样式表之 QSS 语法介绍；QLineEdit、

 内容来自Qt样式表之 QSS 语法介绍-3YL的博客

Qt样式表是一个可以自定义部件外观的十分强大的机制，可以用来美化部件。Qt样式表的概念、术语和语法都受到了HTML的层叠样式表（Cascading Style Sheets, CSS 教程)的启发，不过与CSS不同的是，Qt样式表应用于部件的世界。

类型选择器

QPushButton

匹配QPushButton及其子类的实例

ID选择器

QPushButton#okButton

匹配所有objectName为okButton的QPushButton实例。

 CSS常用样式

1 CSS文字属性

注：px:相对长度单位，像素（Pixel）。pt:绝对长度单位，点（Point）。

CSS文字属性及示例	说明
color:#999999;	文字颜色
font-family:Microsoft Yahei,sans-serif;	字体家族
font-size:16pt;	字体大小
font-style:itelic;（normal、oblique）	字体样式
letter-spacing:1pt;	字间距离
line-height:200%;	设置行高
font-weight:bold;（lighter、normal、数值900）	字体粗细
text-decoration:underline;（line-through、overline、none）	字体修饰
text-align:left;（right、center、justify）	文字左对齐
vertical-align:top;（bottom、middle、text-top、text-bottom）	垂直对齐方式
text-transform:uppercase;（lowercase、capitalize）	英文大写
font-variant: small-caps;（normal）	小型大写字母

2 CSS背景样式：

CSS背景样式及示例	说明
background:black;	背景颜色为黑色
background-color:#F5E2EC;	背景颜色
background-image:url(/image/bg.gif);	背景图片
border-image:url(:/icons/pulldown.png)	部件背景图片
background:transparent;	透视背景
background-repeat : repeat;	重复排列-网页默认
background-position : center;	指定背景位置-居中对齐

CSS边框空白

CSS边框空白及示例	说明
padding:5px 10px 5px 10px;	所有边框留空白
padding-top:10px;	上边框留空白
padding-right:10px;	右边框留空白
padding-bottom:10px;	下边框留空白
padding-left:10px;	左边框留空白

 CSS框线

CSS框线建议书写方式	说明
border:1px solid red;	所有边框线
border-top:1px solid #6699cc;	上框线
border-bottom:1px solid #6699cc;	下框线
border-left:1px solid #6699cc;	左框线
border-right:1px solid #6699cc;	右框线
border-radius:8px;	边框圆角半径
border：none;	无边框

以上是建议书写方式，但也可以使用常规书写方式，如下表所示:

CSS框线常规书写方式	说明
border-top-color:#369;	设置上框线颜色
border-top-width:1px;	设置上框线宽度
border-top-style:solid	设置上框线样式

其他框线样式如下：

• solid - 实线

• dotted - 虚线

• double - 双线

• inset - 凹框

• outset - 凸框

• groove - 立体内凸框

• ridge - 立体浮雕框

5 CSS边界样式

CSS边界样式及示例	说明
margin-top:10px;	上边界值
margin-right:10px;	右边界值
margin-bottom:10px;	下边界值
margin-left:10px;	左边界值

1 通过设置样式控制不同显示效果

/*按钮普通态*/QPushButton
{    /*字体为微软雅黑*/
    font-family:Microsoft Yahei;    /*字体大小为20点*/
    font-size:20pt;    /*字体颜色为白色*/    
    color:white;    /*背景颜色*/  
    background-color:rgb(14 , 150 , 254);    /*边框圆角半径为8像素*/ 
    border-radius:8px;
}/*按钮停留态*/QPushButton:hover
{    /*背景颜色*/  
    background-color:rgb(44 , 137 , 255);
}/*按钮按下态*/QPushButton:pressed
{    /*背景颜色*/  
    background-color:rgb(14 , 135 , 228);    /*左内边距为3像素，让按下时字向右移动3像素*/  
    padding-left:3px;    /*上内边距为3像素，让按下时字向下移动3像素*/  
    padding-top:3px;
}

注：注释只能使用/* */，#和//均无效。

"QQ号码/手机/邮箱"的设置通过placeHoldText设置；可以实现输入灰字消失的效果；