背景图片大小设置

语法：background-size:宽度高度；
作用：设置背景图片大小
取值：

取值	场景
数字+px	简单方便，常用
百分比	相当于当前盒子自身的宽高百分比
contain	包含，将背景图片等比例缩放，直到不会超出盒子的最大
cover	覆盖，将背景图片等比例缩放，直到刚好填满整个盒子没有空白

1.设置一个盒子赋予宽（400px）高（300px），并设置边框便于观察，将原图插入盒子中
2.第一种取值（数字+px）：
- 使用数字＋px 给图片设置和盒子一样的宽高
- background-size: 400px 300px;
3.第二种取值（百分比）：
- 使用百分比给图片设置宽高都为90%
- background-size: 90% 90%;
4.第三种取值（contain）：
- 使用 contain 将背景图片等比例缩放，直到不会超出盒子的最大
- background-size: contain;
5.第四种取值（cover）：
- 使用 cover 将背景图片等比例缩放，直到刚好填满整个盒子没有空白
- background-size: cover;

设置背景图片大小的方法相关推荐

YDOOK : CSS div 设置背景图片大小自动缩放
YDOOK : CSS div 设置背景图片大小自动缩放设置示例: 选择器{width:100%;height:100%;background-repeat:no-repeat:background ...
CSS3的background-size：设置背景图片大小
说明 background-size: length|percentage|cover|contain; 此属性是用来设置 :背景图片的大小 length|percentage|:是用来设定背景图片的 ...
css设置背景图片缩小,css3 设置背景图片大小（缩略图形式缩小）
[译]libev和libevent的设计差异本文译自what's the difference between libev and libevent? 作者是libev作者 [问]两个库都是为异步i ...
java改变背景图片大小,设置背景图片大小相同的的Java应用程序窗口/屏幕
I would like to set a background image the same size as my window/screen. I would prefer to do this ...
css设置div背景图片大小，适应宽度
问题: 没有通过css设置背景图片大小时候,背景图按照真实图片大小展示,会出现超出或者过小情况,如下是图片width:1920px 超出页面设计的1320px,效果如下真实图片是这样的解决方法通 ...
html设置背景图片高度,如何使用CSS设置背景图像的大小？
如何使用CSS设置背景图像的大小?下面本篇文章就来给大家介绍一下使用CSS设置背景图像大小的方法,希望对大家有所帮助. image CSS background-size属性可用于设置背景图像大小:使 ...
小程序设置背景图片的两种方法总结
背景图片我们会时常遇到设置背景图片,这里简单地总结下两种方法: 1.background-image background-image,顾名思义是背景图片的意思,设置父亲元素,然后通过backgro ...
html5中背景图片的大小怎么调,css中怎么改变背景图片大小？
在CSS中,想要改变背景图片的大小,可以通过设置background-size属性来实现.下面本篇文章就来给大家介绍一下使用background-size属性改变背景图片大小的方法,希望对大家有所帮助 ...
java改变背景图片大小_java编写界面设置背景图片的大小
设置背景图片大小跟电脑屏幕大小一致: 方法: ImageIcon background = new ImageIcon("res\\index.jpg"); Dimension s ...
android thumb大小,Android 设置thumb图片大小
xml: android:thumb="@drawable/seekbar_thumb" seekbar_thumb.xml: 修改为: private int seekWidth ...

设置背景图片大小的方法

背景图片大小设置

设置背景图片大小的方法相关推荐

最新文章

热门文章