ExtJS-Viewport背景图片铺满浏览器视图并自动伸缩
var viewport = Ext.create('Ext.container.Viewport', {
style : 'background-image:url(login_bj.jpg);background-repeat: no-repeat;filter:"progid:DXImageTransform.Microsoft.AlphaImageLoader(sizingMethod=\'scale\')";-moz-background-size:100% 100%;background-size:100% 100%;',
layout : {
type : 'vbox',
align : 'center',
pack : 'center'
},
items : [loginForm]
});
只用添加一行代码(style)即可轻松实现背景图片铺满浏览器视图并自动伸缩。
效果图:
ExtJS-Viewport背景图片铺满浏览器视图并自动伸缩的更多相关文章
- IE9以下通过css让html页面背景图片铺满整个屏幕
第一种方法不设为背景图片,通过css来控制样式,可兼容到IE6,代码如下: <!DOCTYPE html> <html lang="en"> <hea ...
- css 设置背景图片铺满固定不动
#page{ position: relative; width: 100%; height: 100%; background-image:url(../img/bg.JPG); backgroun ...
- css 背景图片铺满
body { width: 100%; height: 100%; background: url(img/loginbg.png); background-size: 100% 100%; back ...
- css 设置body背景图片铺满
background-image: url(../../../assets/images/workflow/work.png); background-repeat: no-repeat; backg ...
- css background-size与背景图片填满div
background-size与背景图片填满div 在开发中,常有需要将一张图片作为一个div的背景图片充满div的需求 background-size的取值及解释 background-size共有 ...
- Unity2D 背景图铺满与Camera.Size的计算公式
在unity制作2D游戏的教程,背景图sprite铺满显示时Camaer的Size调到多少合适,作个笔记. 资源参数 background.png 2048x640,Sprite的像素单位:100 调 ...
- 设置ImageView显示的图片铺满全屏
转自:http://m.blog.csdn.net/blog/wjwj1203/32334459 为适应不同屏幕的手机,ImageView显示的图片可能不铺满屏幕,如果定高的话,两边可能会出现空白 ...
- 移动端设置, mobile , 一张图片作为背景 ,平铺 ,自动拉伸 , 图片 铺满视界 ,窗口. background-image , background-size, background-repeat
1. 效果: 浏览器: 手机模拟: 2.代码: <!DOCTYPE html> <html lang="en"> <head> <met ...
- html始终让元素居中显示,背景图铺满随便拖动不出界
首先.写两个class属性 body { margin: 0; padding: 0; height: 100%; width: 100%; background-image: url(../Cont ...
随机推荐
- SharePoint 2013 开发——发布SharePoint应用程序
博客地址:http://blog.csdn.net/FoxDave 前几篇我们介绍了开发.部署和调试SharePoint应用程序的基础,本篇介绍更实用的操作,当我们开发一个SharePoint应用 ...
- 按Right-BICEP要求的任务二的测试
测试方法:Right-BICEP 测试计划: 1.Right-结果是否正确? 2.B-是否所有的边界条件都是正确的? 3.P-是否满足性能要求? 4.是否有乘除法? 5.是否有括号? 6.是否有输出方 ...
- xcode插件种类
古人云“工欲善其事必先利其器”,打造一个强大的开发环境,是立即提升自身战斗力的绝佳途径!以下是搜集的一些有力的XCode插件. 1.全能搜索家CodePilot 2.0 你要找的是文件?是文件夹? ...
- 云计算平台简介(App Engine)
云计算平台简介(App Engine) 1 简介 App Engine: 应用程序引擎,是托管网络应用程序的云计算平台. 1.1 什么是云 云计算通常简称为“云”,是一种通过 Inter ...
- 极客DIY:开源WiFi智能手表制作
如果你喜欢拥有一款属于自己的无线手表,那么请不要错过,相信阅读完这篇文章对你会很有帮助. 硬件规格 ESP8266(32Mbit闪存) MPU-9250(陀螺仪传感器)以及 AK8963(内置磁力计) ...
- 前端开发者应该知道的 CSS 小技巧
一些小技巧让你的CSS技术更专业 使用:not()去除导航上不需要的边框 为body添加行高 垂直居中任何元素 逗号分离的列表 使用负nth-child选择元素 使用SVG图标 文本显示优化 在纯CS ...
- ERP登录(八)
登录的存储过程: ALTER PROCEDURE [dbo].[UserLogin] @userid int output, @LoginName nvarchar(50), @Password nv ...
- Smart210学习记录----beep linux字符设备驱动
今天搞定了beep linux字符设备驱动,心里还是很开心的,哈哈...但在完成的过程中却遇到了一个非常棘手的问题,花费了我大量的时间,,,, 还是把问题描述一下吧,好像这个问题很普遍的,网上许多解决 ...
- Magento速度优化
一.Magento Compiler可以提高 25% 到 50% 速度 Magento的性能一直是大家比较关心的焦点,现在Magento最新的版本 1.3.2.2 增加了 Magento Compil ...
- Tomcat9源码编译及导入Eclipse(转)
1.下载tomcat源码.建议下载最新版本tomcat9. svn地址:http://svn.apache.org/repos/asf/tomcat/tc9.0.x/branches/gsoc-jas ...