css body背景图全屏不论分辨率大小

css body背景图全屏,不论分辨率大小。在body里嵌套一个img元素，控制这个img 的z-index为-1即可。

　　代码如下:

　　<img id="bg" src="../images/bg.jpg" width="100%" height="100%" style="right: 0; bottom: 0;position: absolute; top: 0;

时间： 2024-09-28 03:30:48

css body背景图全屏不论分辨率大小的相关文章

关于CSS控制背景图的问题

于想设置可变背景,所以想用CSS控制背景图如果单是改变颜色的可以实现但在用背景图时设置平铺无效以下代码直接放在应用的网页中没有问题但放在CSS里时,只能显示实际大小的背景图,无论设置平铺还是其它都没有改变各位兄弟来支支招,先谢谢了, 代码: <style type="text/css"> <!-- body { background-image: url(/目录1/目录2/bg.jpg); background-repeat:

css3背景图片全屏显示的例子

如何用css背景图片拉伸以及100% 满屏显示呢?这个问题听起来似乎很简单.但是很遗憾的告诉大家.不是我们想的那么简单. 比如一个容器(body,div,span)中设定一个背景.这个背景的长宽值在css2.1之前是不能被修改的. 所以实际的结果是只能重复显示,所以出现了repeat,repeat-x,repeat-y,no-repeat这些属性.就是用来控制背景图片的显示的.所以一般用作背景图片的有2类: 1.是一整张大图,尺寸和区域大小刚好吻合 2.一个很小的条状图,通过repeat后,形

24个特色人像背景的全屏网站设计

人物肖像对视觉引导天然有不可思议的力量,现在全屏网页正在风头,有聪明的设计师已经将这种技巧运用上去了,效果超级赞!今天分享一组高质量的特色人像背景全屏网站,不仅设计有范,模特也好看,绝对是灵感的自助盛宴!木有灵感的设计师,今天放开肚皮吃一顿吧!最后有彩蛋呦! I Like Photo Tina Gauff Nicolas Will TekRoc Design Agency Nathaniel Deal M2B Tobias van Schneider Magisto Francesco Mo

JS+CSS实现弹出全屏灰黑色透明遮罩效果的方法_javascript技巧

本文实例讲述了js+CSS实现弹出一个全屏灰黑色透明遮罩效果的方法.分享给大家供大家参考.具体分析如下: 在众多的网站都有这样的效果,当进行一定的操作之后,会弹出一个灰黑色的半透明的遮罩,在上面可以操作指定的内容,例如可以弹出一个登陆框之类的内容,下面就介绍一下如何实现此种效果,代码实例如下: 复制代码代码如下: <!DOCTYPE html> <html> <head> <meta charset=" utf-8">

css html-html背景图平铺浏览器问题

问题描述 html背景图平铺浏览器问题拿到ui设计的背景图,直接设置宽高100%,会导致图片变形,各位大牛有什么好的解决方法吗? 解决方案 http://www.itnose.net/detail/6110755.htmlhttp://blog.sina.com.cn/s/blog_a7b8ab2801019lh7.html 解决方案二: http://blog.csdn.net/liuliang841210/article/details/39993541

jQuery插件bgStretcher.js实现全屏背景特效_jquery

bgStretcher 2011 (Background Stretcher)是一个jQuery的插件,可以为你的网页添加多张背景图,且多个背景图能够自动切换,同时背景图大小可以自适应浏览器窗口的大小.背景图的切换效果有淡入淡出,滚动,幻灯,其中选用滚动和幻灯时,可以选择方向,上下左右,或者左上右下,右上左下.图片切换顺序也可以设置正向,反向或者随机.更多选项就看你自己慢慢研究了. bgStretcher是一个jQuery插件,它允许你添加一个大图像(或一组图像)到您的网页的背景,并会按比例调整

How to Use HTML5 FUll Screen API（如何使用HTML5全屏接口）

原文链接:http://www.sitepoint.com/use-html5-full-screen-api/ 如果你不太喜欢变化太快的东西,那么web开发可能不适合你.我曾在2012年末有写过Full-Screen API的介绍,并且当时就提到其实现细节可能会被修改,但是没有想到一年后我需要重写!本篇的所讲的内容也许不是最新的,但是非常感谢David Storey帮我重点归纳出近期技术方面的变化.... 什么是Full-Screen API? 此AP

Flash+JS 打造全屏仿windows

js|window Flash+JS 打造全屏仿windows 一.需求分析: 1:全屏页面分辨率需为 1024*768 如果低于此分辨率,画面精细的效果得不到体现.所以应该限制此分辩率以下的操作系统访问此界面. 2:打开的全屏窗口应该右上角有最小化.关闭按扭. 3:每个载入的窗口应该可以移动.关闭.最小化. 4:桌面上的图标可以拖动,双击. 5:屏幕底部有一个任务栏,当鼠标移至屏幕底部,任务栏从底部弹出.可以用一个按扭使其退回屏幕底部. 二.技术要点: Java Script:Screen 对

FLASH+JS做的全屏效果及AS集锦

js 一.需求分析:1:全屏页面分辨率需为 1024*768 如果低于此分辨率,画面精细的效果得不到体现.所以应该限制此分辩率以下的操作系统访问此界面.2:打开的全屏窗口应该右上角有最小化.关闭按扭.3:每个载入的窗口应该可以移动.关闭.最小化.4:桌面上的图标可以拖动,双击.5:屏幕底部有一个任务栏,当鼠标移至屏幕底部,任务栏从底部弹出.可以用一个按扭使其退回屏幕底部. 二.技术要点: Java Script:Screen 对象 (object):该对象具有以下属性(Properties):a