css3 设置背景图片大小(缩略图形式缩小)
废话当然不说了。
直接上代码
- <style>
- #mycon
- {
- background:url('Tpl/1.jpg');
- background-size:400px 400px;
- background-repeat:no-repeat;
- border-radius: 4px;
- border: 1px solid #ccc;
- width: 400px;
- height: 400px;
- }
- </style>
- <div id="mycon">
- 原来背景图大小:970*630
- 这里才是战场,以缩略图的形式来将背景图设置
- </div>
- background-size:400px 400px;
后面是设置缩略图宽和高。
效果如图:
css3 设置背景图片大小(缩略图形式缩小)的更多相关文章
- CSS3设置背景图片的大小
设置背景图片的大小,以长度值或百分比显示,还可以通过cover和contain来对图片进行伸缩. background-size 语法详解: 要在插入图片之后进行设置背景图片的大小 backgroun ...
- background-size 设置背景图片的大小
background-size 设置背景图片的大小,以长度值或百分比显示,还可以通过cover和contain来对图片进行伸缩. 语法: background-size: auto | <长度值 ...
- background-size (设置背景图片的大小)
设置背景图片的大小,以长度值或百分比显示(数值包括 长度length和百分比percentage),还可以通过cover和contain来对图片进行伸缩. 语法:background-size: au ...
- CSS3 background-image背景图片相关介绍
这里将会介绍如何通过background-image设置背景图片,以及背景图片的平铺.拉伸.偏移.设置大小等操作. 1. 背景图片样式分类 CSS中设置元素背景图片及其背景图片样式的属性主要以下几个: ...
- [Netbeans]为面板设置背景图片
与AndroidStudio等类似IDE不同,在Netbeans开发桌面程序时,不可以直接通过src=@drawable 等方法为窗口设置背景图片.这里介绍一种简便的方法: 1:首先,拖动一个面板到f ...
- qt 设置背景图片
博客出处:http://www.cppblog.com/qianqian/archive/2010/07/25/121238.htm 工作似乎走上正轨了,上周五的工作是做一个界面,用到QFrame和Q ...
- css网页中设置背景图片的方法详解
在css代码中设置背景图片的方法,包括背景图片.背景重复.背景固定.背景定位等 用css设置网页中的背景图片,主要有如下几个属性: 1,背景颜色 {">说明:参数取值和颜色属性一样 ...
- Qt 设置背景图片3种方法(三种方法:QPalette调色板,paintEvent,QSS)
方法1. setStylSheet{"QDialog{background-image:url()"}} //使用styleSheet 这种方法的好处是继承它的dialog都会自 ...
- img只显示图片一部分 或 css设置背景图片只显示图片指定区域
17:14 2016/3/22img只显示图片一部分 或 css设置背景图片只显示图片指定区域 background-position: 100% 56%; 设置背景图片显示图片的哪个坐标区域,图片左 ...
随机推荐
- 前端开发web组件之旅(一)-- 定义与加载组件
/* 前言 */ 自上而下的 职责和API应用层框架层框架浏览器 一 组件定义与调用 1.增加一个组件 tabview.css ------------------------------------ ...
- iOS 细节 问题
1.当一个空指针(nil pointer)调用了一个方法会发生什么? 安然无恙 —— 这是oc自带的消息机制,nil也能发送消息,而不会报错 2.为什么retainCount绝对不能用在发布的代码中? ...
- A Diagram Designer
源码:http://files.cnblogs.com/jumahe/DiagramDesigner.rar 环境:VS2010
- MVC架构学习
作为一名小小的GreenBird,学习MVC呢,已经花费了2天了,期间得到了美丽的学姐的帮助,初步整理了一下. 首先,学习MVC呢就先以一个标准的MVC的简单的例子来入手,然后根据学姐的PPT,我用v ...
- 【Ireport】利用Ireport5.2的table组件迅速制作表格导出pdf
转载请注明网址.Ireport table dataset Ireport在半年前还是4.7,今天无意发现,居然出到了5.2就搞一把. 首先,去下载Ireport,并进行安装.这个我就不演示了.下载完 ...
- 【Java】Java Platform
The Java platform has two components: The Java Virtual Machine The Java Application Programming Inte ...
- 当我们在谈论 DevOps,我们在谈论什么?
Cloud Insight 携手 BearyChat:打造适合运维人员的团队协作工具 走过 C 轮的 OneAPM,旗下的产品已经日渐丰满,从应用性能监控的 Application Insight 到 ...
- Energy Minimization
zoj2539:http://acm.zju.edu.cn/onlinejudge/showProblem.do?problemCode=2539 题意:公式第一项只要当xi=0时才会有作用,第二项只 ...
- Hibernate中对象的三种状态以及Session类中saveOrUpdate方法与merge方法的区别
首先,用一张图说明一个对象,在Hibernate中,在调用了不同方法之后对象所处的不同状态 在Hibernate中,一个对象的状态可以被分为如图所示的三种 Transient:瞬时对象,该对象在数据库 ...
- Spring MVC 解读——<context:component-scan/>
转自:http://my.oschina.net/HeliosFly/blog/203149 作者:GoodLoser. Spring MVC 解读---<context:component-s ...