设置背景图片的大小,以长度值或百分比显示,还可以通过cover和contain来对图片进行伸缩。

background-size

语法详解:

要在插入图片之后进行设置背景图片的大小

 background-size:auto;/* 默认值,不改变背景图片的高度和宽度 */
background-size:100px 50px;/* 第一个值为宽,第二个值为高,当设置一个值时,将其作为图片宽度来等比缩放 */
background-size:10%;/* 0%~100%之间的任何值,将背景图片宽高按百分比显示,当设置一个值的时候同也将其作为图片宽度来等比缩放 */
background-size:cover;/* 将背景图片等比缩放填满整个容器 */
background-size:contain;/* 将背景图片等比缩放至某一边紧贴容器边缘 */

CSS3设置背景图片的大小的更多相关文章

  1. background-size 设置背景图片的大小

    background-size 设置背景图片的大小,以长度值或百分比显示,还可以通过cover和contain来对图片进行伸缩. 语法: background-size: auto | <长度值 ...

  2. background-size (设置背景图片的大小)

    设置背景图片的大小,以长度值或百分比显示(数值包括 长度length和百分比percentage),还可以通过cover和contain来对图片进行伸缩. 语法:background-size: au ...

  3. css3 设置背景图片大小(缩略图形式缩小)

    废话当然不说了. 直接上代码 <style> #mycon { background:url('Tpl/1.jpg'); background-size:400px 400px; back ...

  4. CSS3 background-image背景图片相关介绍

    这里将会介绍如何通过background-image设置背景图片,以及背景图片的平铺.拉伸.偏移.设置大小等操作. 1. 背景图片样式分类 CSS中设置元素背景图片及其背景图片样式的属性主要以下几个: ...

  5. css3-11 如何改变背景图片的大小和位置

    css3-11 如何改变背景图片的大小和位置 一.总结 一句话总结:css3相对css2本身就支持改变背景图片的大小和位置. 1.怎么设置背景不填充padding部分? background-orig ...

  6. [Netbeans]为面板设置背景图片

    与AndroidStudio等类似IDE不同,在Netbeans开发桌面程序时,不可以直接通过src=@drawable 等方法为窗口设置背景图片.这里介绍一种简便的方法: 1:首先,拖动一个面板到f ...

  7. qt 设置背景图片

    博客出处:http://www.cppblog.com/qianqian/archive/2010/07/25/121238.htm 工作似乎走上正轨了,上周五的工作是做一个界面,用到QFrame和Q ...

  8. css网页中设置背景图片的方法详解

    在css代码中设置背景图片的方法,包括背景图片.背景重复.背景固定.背景定位等   用css设置网页中的背景图片,主要有如下几个属性: 1,背景颜色 {">说明:参数取值和颜色属性一样 ...

  9. Qt 设置背景图片3种方法(三种方法:QPalette调色板,paintEvent,QSS)

    方法1. setStylSheet{"QDialog{background-image:url()"}}  //使用styleSheet 这种方法的好处是继承它的dialog都会自 ...

随机推荐

  1. 固定UILabel宽度分行显示

    固定UILabel宽度分行显示 这种小伎俩估计都被用烂了,笔者给大家提供一个category文件,供大家简单设置哦. 各种富文本效果哦(普通文本也是可以用的呢): 3行,固定宽度200 2行,固定宽度 ...

  2. 如何打包ipa文件

    如何打包ipa文件 1. 新建一个工程 // // RootViewController.m // YouXianMing // // Copyright (c) 2014年 Y.X. All rig ...

  3. Linux /dev/null详解

    常用的命令展示 /dev/null 和 /dev/zero的区别        1./dev/null:表示 的是一个黑洞,通常用于丢弃不需要的数据输出, 或者用于输入流的空文件            ...

  4. Linux--安全加固01

    Redhat是目前企业中用的最多的一类Linux,而目前针对Redhat攻击的黑客也越来越多了.我们要如何为这类服务器做好安全加固工作呢? 一. 账户安全 1.1 锁定系统中多余的自建帐号 检查方法: ...

  5. 启动64位 IIS 32位应用程序的支持

    64位的系统可以让IIS在32位的环境下运行asp.net程序,设置方法如下: ASP.NET程序在编译的时候默认是Any CPU,即编译的程序可以在X86.X64系统平台上运行.若希望我们的ASP. ...

  6. Mysql数据库的mysql Schema 究竟有哪些东西& 手工注入的基础要领

    #查看数据库版本号 mysql> select @@version; +------------+ | @@version  | +------------+ | 5.5.16-log | +- ...

  7. linux批量远程多服务器FTP并下载文件的脚本

    #!/bin/bashtime=`date +%Y%m`day=`date -d '-1 days' +%Y%m%d`localDir="/DBBackup/GameDB"cd $ ...

  8. C#调取webapi

    //定义参数 C#调取webapi var content = new FormUrlEncodedContent(new Dictionary<string, string>() { { ...

  9. Yii安装使用教程(转)

    Yii 是一个基于组件的高性能 PHP 框架,用于快速开发大型 Web 应用.它使Web开发中的 可复用度最大化,可以显著提高你的Web应用开发速度.Yii 这个名字(读作易(Yee) 或 [ji:] ...

  10. HDU 3591 (完全背包+二进制优化的多重背包)

    题目链接: http://acm.hdu.edu.cn/showproblem.php?pid=3591 The trouble of Xiaoqian Time Limit: 2000/1000 M ...