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背景图片铺满浏览器视图并自动伸缩的更多相关文章

  1. IE9以下通过css让html页面背景图片铺满整个屏幕

    第一种方法不设为背景图片,通过css来控制样式,可兼容到IE6,代码如下: <!DOCTYPE html> <html lang="en"> <hea ...

  2. css 设置背景图片铺满固定不动

    #page{ position: relative; width: 100%; height: 100%; background-image:url(../img/bg.JPG); backgroun ...

  3. css 背景图片铺满

    body { width: 100%; height: 100%; background: url(img/loginbg.png); background-size: 100% 100%; back ...

  4. css 设置body背景图片铺满

    background-image: url(../../../assets/images/workflow/work.png); background-repeat: no-repeat; backg ...

  5. css background-size与背景图片填满div

    background-size与背景图片填满div 在开发中,常有需要将一张图片作为一个div的背景图片充满div的需求 background-size的取值及解释 background-size共有 ...

  6. Unity2D 背景图铺满与Camera.Size的计算公式

    在unity制作2D游戏的教程,背景图sprite铺满显示时Camaer的Size调到多少合适,作个笔记. 资源参数 background.png 2048x640,Sprite的像素单位:100 调 ...

  7. 设置ImageView显示的图片铺满全屏

    转自:http://m.blog.csdn.net/blog/wjwj1203/32334459   为适应不同屏幕的手机,ImageView显示的图片可能不铺满屏幕,如果定高的话,两边可能会出现空白 ...

  8. 移动端设置, mobile , 一张图片作为背景 ,平铺 ,自动拉伸 , 图片 铺满视界 ,窗口. background-image , background-size, background-repeat

    1.  效果: 浏览器: 手机模拟: 2.代码: <!DOCTYPE html> <html lang="en"> <head> <met ...

  9. html始终让元素居中显示,背景图铺满随便拖动不出界

    首先.写两个class属性 body { margin: 0; padding: 0; height: 100%; width: 100%; background-image: url(../Cont ...

随机推荐

  1. 在Windows平台搭建PHP开发环境(四)

    一.概念 1.1 在Windows下搭建 wamp: apache(iis) + php + mysql +phpmyadmin 1.2 在Linux下搭建     lamp: linux + php ...

  2. MySQL语句45道练习题及答案

    一.            设有一数据库,包括四个表:学生表(Student).课程表(Course).成绩表(Score)以及教师信息表(Teacher).四个表的结构分别如表1-1的表(一)~表( ...

  3. php大力力 [036节] 后台系统的登录页面界面做完啦

    php大力力 [036节] 后台系统的登录页面界面做完啦 我认为做的不错,我就先不上截图啦 要你的祝福 分布注册 Twitter Login Or Signup Form 藤藤每日一练——172个Ic ...

  4. 数据结构 《5》----二叉搜索树 ( Binary Search Tree )

    二叉树的一个重要应用就是查找. 二叉搜索树 满足如下的性质: 左子树的关键字 < 节点的关键字 < 右子树的关键字 1. Find(x) 有了上述的性质后,我们就可以像二分查找那样查找给定 ...

  5. BZOJ 2241 打地鼠

    暴力. 这怎么这么快.... #include<iostream> #include<cstdio> #include<cstring> #include<a ...

  6. 转:Spring中@Autowired注解、@Resource注解的区别

    Pay attention: When using these annotations, the object itself has to be created by Spring context. ...

  7. Android重写getResources规避用户调整系统字体大小影响Android屏幕适配

    Android屏幕适配一直是一个头疼的问题.除此之外还要考虑APP在实际应用场景中,用户千奇百怪的设置,最常见的用户设置行为就是设置手机的字体大小,比如把字体设置成超大或者超小,这对屏幕适配又带来额外 ...

  8. 拆解一个简单的KeyFile保护

    系统 : Windows xp 程序 : abexcrackme3 程序下载地址 :http://pan.baidu.com/s/1mh3TiqO 要求 : 伪造Keyfile 使用工具 :IDA 可 ...

  9. Inherits、CodeFile、CodeBehind的区别

    Inherits.CodeFile.CodeBehind 在 ASP.NET 中使用代码隐藏方法来设计Web 窗体,可使页代码能够更清晰地从 HTML 内容中分离到完全单独的文件中. 通常一个 @pa ...

  10. source insight 注册码

    分享一下google来的 呵呵 Source Insight,一个无比强大的工具.一个很好的查看代码的工具.到它的官网上去看一下,就知道,世界上基本上所有的大的软件公司,都在用这个工具.习惯了这个工具 ...