默认情况下,通过HTML代码的BODY标签设置好背景图片<body background="x.jpg"> 后,图片会自动横向和纵向平铺。这就会产生一些美观上的问题。 XP人提供CSS代码如下,放在页面头部即可,仅供参考: <style type="text/css"> body { background:url(/img/background.png); background-repeat: repeat-x; background-positon: 100%,100%;} < /style>

续: 有几位朋友说我的这篇文章实在没能解决他们的问题,他们希望的是不考虑自己背景图片的大小,不管多大的屏幕,自己的背景图片自动上下拉伸自己,适应屏幕大小,铺满整个屏幕。所以,我今天再把下面的代码和大家分享。要想实现这样的效果,可以考虑使用滤镜。 <style type="text/css"> body{ filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='/skin/v2011/images/body.png',sizingMethod='scale'); background-repeat: no-repeat; background-positon: 100%, 100%; } < /style>

如何通过CSS实现背景图片自动平铺或拉伸至整个屏幕(自适应大小)的更多相关文章

  1. css如何将图片横向平铺?

    在CSS中,可以使用background(背景)属性来添加图片,默认图片是向x轴和y轴重复.那么css如何将图片横向平铺?下面本篇文章就来给大家介绍一下使用CSS将图片横向平铺的方法,希望对大家有所帮 ...

  2. Android 背景图片重复平铺

    有时候我们需要将一个图片横向或者纵向的平铺(重复循环),这个时候我们需要创建一个xml文件,如下: <?xml version ="1.0" encoding =" ...

  3. CSS背景颜色、背景图片、平铺、定位、固定

    CSS背景颜色设置 background-color:red;如设置背景颜色为红色: 背景颜色设置支持3种写法: 颜色名 16进制 rgb CSS背景图片颜色设置 background-image:u ...

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

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

  5. CSS实现背景图片屏幕自适应

    在做登陆页面等的首页的时候,经常会遇到需要放一张背景大图的情况,并且需要图片按比例缩放,来适应不同屏幕的大小. html代码如下: <!DOCTYPE html> <html lan ...

  6. img只显示图片一部分 或 css设置背景图片只显示图片指定区域

    17:14 2016/3/22img只显示图片一部分 或 css设置背景图片只显示图片指定区域 background-position: 100% 56%; 设置背景图片显示图片的哪个坐标区域,图片左 ...

  7. CSS中背景图片定位方法

    转自:http://www.ruanyifeng.com/blog/2008/05/css_background_image_positioning.html 作者: 阮一峰 日期: 2008年5月 ...

  8. CSS中背景图片的background-position中的left top到底是相对于谁的?

    在学习的时候遇到了如下问题: CSS中背景图片的background-position中的left top到底是相对于谁的,content-box?padding-box?border-box? ba ...

  9. (转)HTML&CSS——background: url() no-repeat 0 -64px;CSS中背景图片定位方法

    http://blog.csdn.net/oscar92420aaa/article/details/51304067 CSS中背景图片的定位,困扰我很久了.今天总算搞懂了,一定要记下来. 在CSS中 ...

随机推荐

  1. 下载Ext JS 5.1 gpl版本的方法

    先进入官网:http://www.sencha.com 然后在导航的Products中选择Sencha Ext JS,会看到以下页面: 这时候不要单击Download按钮,而是要单击导航中的DETAI ...

  2. Cannot start service MSSQL$MICROSOFT##WID on computer

    在做ADFS部署过程中配置ADFS服务时遇到如下问题 检查系统日志错误日志如下,很明显"NT SERVICE\MSSQL$MICROSOFT##WID"这个账户不在log on a ...

  3. Linux 学习笔记_12_文件共享服务_3_NFS网络文件服务

    NFS网络文件服务 NFS---- Network File System 用于UNIX/Linux[UNIX类操作系统]系统间通过网络进行文件共享,用户可以把网络中NFS服务器提供的共享目录挂载到本 ...

  4. MySQL学习笔记_7_MySQL常用内置函数

    MySQL常用内置函数 说明: 1)可以用在SELECT/UPDATE/DELETE中,及where,orderby,having中 2)在函数里将字段名作为参数,变量的值就是字段所对应的每一行的值. ...

  5. 将studio项目 转换为eclipse项目

    总会有些奇怪的事情,比如,有的人就有将studio项目 转换为eclipse项目的需求 首先,不要因为编译原因而放弃.studio项目是完全可以转换成eclipse的 本站的开源代码板块有很多项目都是 ...

  6. android 开发Handler源码剖析

    Android的消息机制主要是Handler的运行机制,而讲Handler的机制,又需要和MessageQueue和Looper结合.MessageQueue中文意思是消息队列,虽说叫队列,但是其内部 ...

  7. OpenGL Shader Key Points (2)

    1.  Uniform 1.1.  Uniform变量 不是所有的变量都是跟顶点一一对应的,如变换矩阵,光源位置等. Uniform变量可以在任何类型的shader中使用,但只能作为输入值,不能在sh ...

  8. objc一个NetConnector类示例

    NetConnector是自定义的一个类,该类使用代理的方法实现异步下载特定url页面的内容. HyNetConnector.h // // HyNetConnector.h // HyNetConn ...

  9. 基于opencv的gpu与cpu对比程序,代码来自opencv的文档中

    原文链接: http://www.opencv.org.cn/opencvdoc/2.3.2/html/doc/tutorials/gpu/gpu-basics-similarity/gpu-basi ...

  10. time元素与微格式/pubdate属性

    首先来说下微格式,它是一种利用HTML的class属性来对网页添加诸如新闻事件发生的日期和时间.个人电话号码.企业邮箱之类的附加信息方法. time元素代表24小时中的某个时刻或某个日期,表示时刻时允 ...