background qt 设置平铺_Qt中关于background、background-image和border-image的学习和记录

设置背景图已知有三种方法

background:url();//平铺

background-image:url();//平铺

border-image：url();//拉伸填充

其中第一种方法可以直接在尾部添加no-repeat阻止图片平铺；第二种则需要添加background-repeat语句：

background:url() no-repeat;//阻止平铺

backgroundimage:url();

background-repeat:no-repeat;//阻止平铺

在repeat中可以设置repeat-xy来限定横纵方向的平铺。

background中可以通过top bottom left right center五个关键字设置背景图的位置，也可以通过margin-left和margin-top设定像素位置。

background-position:top right;//设定在右上方

margin-left：34；

margin-top:34px;//设定背景图左上角坐标在(34，34)位置

暂未找到background-image调整大小的方法，这点存疑。

下面说说border-image。它是对图像进行缩放填充，有些细节要记录一下：

border-image最多有5个参数分别是url 上右下左的距离(边框大小)。参数可以省略或部分省略。

border:40;//等同于下

border-top:40;

border-right:40;

border-bottom:40;

border-left:40;

以上效果是锁定边框的大小。

border-image:url()0 27;

border-left:27;

border-right:27;

//以上初始化左右边框为27，之后锁定左右大小为27，只有拖拽都不会改变左右边框的水平大小

//实际是讲左右边框进行了缩放，所以此时如果初始化未设定边框大小，进行边框设定时会默认原比例；而如果初始了边框大小而未设置边框缩放，则默认为0，效果即为边框不显示

border-image:url()0 27;//左右27px不显示

border-image:url();

border-left:27;

border-right:27;//效果和最上相同，将左右27px锁定

border-image:url()0 15;

border-left:27;

border-right:27;//将左右15px拉伸至27px，锁定不随界面拉伸

加入把没有像素的位置进行拉伸就可以实现透明区域，算是变相实现绘图位置改变的一种手段了。

border-image:url()0;

border:27;//四周显示透明区域