CSS 样式表中padding 的用法

CSS中padding 描述的是内边距的意思,margin是外边距。QSS中同样的道理。

1. padding表示内边距的意思,margin---外边距。
2. CSS的 padding 属性定义元素边框与元素内容之间的空白区域。
3. padding 接受长度值或百分比值,但不允许使用负值。
4. 示例:如果希望所有内边距都是10 像素,只需要设置:padding:10px; 就可以了。
5. 也可以分别设置4个边的内边距,只需通过它们的单独属性,分别设置上、右、下、左内边距:
* padding-top
padding-right
* padding-bottom
* padding-left
简写就是:padding:1px 10px 1px 3px; (上右下左),此写法符合标准,推荐使用。

所以当在样式表中设置QcomboBox 的样式:实际上QComboBox 的minimumSize的width 为: 85 px = 72 (min-width ) + 10 (padding-right) + 3(padding-left) + 2 (left-border) + 2(right-border) (px)

QComboBox{border : 2px solid blackborder-radius:3px
min-width : 72px;
padding: 1px 10px 1px 3pxcolor: black
//实际上QComboBox 的minimumSize的width 为: 85 px = 72 (min-width ) + 10 (padding-right) + 3(padding-left) + 2 (left-border) + 2(right-border) (px)
}

  

原文地址:https://www.cnblogs.com/shuifei/p/10348759.html

时间: 2024-10-14 17:24:28

CSS 样式表中padding 的用法的相关文章

css样式表中设置table的第一列的宽度是固定值

table{table-layout:fixed;}table tr td:first-child,table tr td:first-child{width:120px;} 首行第一个td定宽同列的宽度都会和他一样. *注意 第一行 第一个用的是 td 还是 th css样式表中设置table的第一列的宽度是固定值,布布扣,bubuko.com

css样式表中四种属性选择器

css样式表中四种属性选择器1> 简易属性 tag[class]{ font-weight:bold } It will affect all tag with any class. e.g. <h2 class="old" > or <h2 class="new"> 2>精确属性值 a[href="http://www.cnblogs.cn"][title="textTitle"]{fon

css样式表中的样式覆盖顺序

css样式表中的样式覆盖顺序 - - ITeye技术网站http://spartan1.iteye.com/blog/1526735 重点归纳: 查找一些教材中(w3schools等),只说css的顺序是“元素上的style”>“文件头上的style元素”>“外部样式文件”,但对于样式文件中的多个相同样式的优先级怎样排列,没有详细说明.经过测试和继续搜索,得知优先级如下排列: 或者以下也可以称之为一些优先原则(by liwei 20140803) 1.样式表的元素选择器选择越精确,则其中的样式

css样式表中的样式覆盖顺序(转)

转自:http://spartan1.iteye.com/blog/1526735 有时候在写CSS的过程中,某些限制总是不起作用,这就涉及了CSS样式覆盖的问题,如下 Css代码 #navigator { height: 100%; width: 200; position: absolute; left: 0; border: solid 2 #EEE; } .current_block { border: solid 2 #AE0; } 查找一些教材中(w3schools等),只说css的

从css样式表中抽取元素尺寸

jS从样式表取值的函数,IE中以currentStyle,firefox中defaultView来获取 DOM.style只能读到写在html中的样式值 获取样式值的函数 function returnStyle(obj,styleName){ var myObj = typeof obj =="string" ? document.getElementById(obj) : obj; if(document.all){ return eval("myObj.currentS

laravel项目中css样式表的背景图片不显示

刚学laravel,遇到了很多坑,感觉laravel是挺强大的. 建好后台项目,奈何css样式表的背景图片不显示 .mainhd { background: url(../images/sky/body_bg.png) repeat-x 0px 0px; } 按理上面的写法没错,因为是从别的后台搬过来的,但是图片一直不显示,访问绝对路径却又能显示图片,坑. 原因是因为图片路径要使用单引号或者双引号的,下面是正确的写法 .mainhd { background: url('../images/sk

当css样式表遇到层

(附:White-space:pre可以是样式表里卖弄body的属性,作用是保持html源代码的空格与换行,等同<pre>标签.) Css样式表可以通过被封在层里的方式来限制页面所修饰的内容.这就是说,为了使样式表只对页面局部起修饰作用,设计者可以将页面的局部内容定义在某个范围之内,这个范围变称为CSS-layer(css层)css层可以通过HTML标签来定义,这种使用方法是web设计中的一枚利器. 1.行<span>和层<div>设计者常常把css样式表放在<s

css样式表

样式表主要分为三类:内联式.内嵌式和外部样式表. 内联式样式表是跟html联合显示,写在body标签里边,属于控制精确,但是可用性差.在三种样式中会优先显示作用. 内嵌式是作为独立区域写在head标签里边.body标签中有对应的标签:<div id/name/class="  "></div>. 外部样式表是新建一个css文件,用来放样式表,在html中用link链接. <link type="text/css" rel="s

网站开发综合技术 第二部分 CSS样式表

第2部分 CSS样式表 CSS(Cascading Style Sheets,层叠样式表),作用是美化HTML网页. /*注释*/    注释语法 2.1.样式表的基本概念 2.1.1.样式表分类 1.内联样式表 和html联合显示,控制精确,但是可重用性差,冗余多. 例:<p style="font-size:14px;">内联样式表</p> 2.内嵌样式表 作为一个独立区域内嵌在网页里,必须写在head标签里边. <style type= "