css怎么让一张图片适应任何屏幕大小的电脑平铺?

html-css016

css怎么让一张图片适应任何屏幕大小的电脑平铺?,第1张

下面是图片不失真但不保证是否完全铺满(留有空隙或者超出屏幕)的css代码:

1、横向铺满,纵向留有空隙或超出屏幕:

body {background:url(图片路径) no-repeat centerbackground-size:100% auto}

2、纵向铺满,横向留有空隙或超出屏幕:

body {background:url(图片路径) no-repeat centerbackground-size:auto 100%}

补充说明:background-size属于css3,只有支持css3的浏览器才有效。

电脑(Computer)是一种利用电子学原理根据一系列指令来对数据进行处理的机器。电脑可以分为两部分:软件系统和硬件系统。第一台电脑是1946年2月15日在美国宾夕法尼亚大学诞生的ENIAC通用电子计算机。

人们把没有安装任何软件的计算机称为裸机。随着科技的发展,现在新出现一些新型计算机有:生物计算机、光子计算机、量子计算机等。

#bg{

margin:0px

background: url(images/beijing.png) no-repeat

background-size:100% 100%

background-attachment:fixed

}

扩展资料:

url(images/beijing.png)——图片路径的位置;

no-repeat—— 图片不重复;

center 0px——center是距离页面左边的定位,0px是距离页面上面的定位;

background-position: center 0——就是图片的定位,同上;

background-size: cover——把背景图像扩展至足够大,以使背景图像完全覆盖背景区域。背景图像的某些部分也许无法显示在背景定位区域中;

min-height: 100vh——视窗的高度,“视区”所指为浏览器内部的可视区域大小,即window.innerWidth/ window.innerHeight大小。

比如<img id='bg' src='bg.jpg'/>

#bg{

position:fixed

width:100%

height:100%

}

万维网上的一个超媒体文档称之为一个页面(外语:page)。作为一个组织或者个人在万维网上放置开始点的页面称为主页(外语:Homepage)或首页,主页中通常包括有指向其他相关页面或其他节点的指针(超级链接),所谓超级链接,就是一种统一资源定位器(Uniform Resource Locator,外语缩写:URL)指针,通过激活(点击)它,可使浏览器方便地获取新的网页。这也是HTML获得广泛应用的最重要的原因之一。在逻辑上将视为一个整体的一系列页面的有机集合称为网站(Website或Site)。超级文本标记语言(英文缩写:HTML)是为“网页创建和其它可在网页浏览器中看到的信息”设计的一种标记语言。

网页的本质就是超级文本标记语言,通过结合使用其他的Web技术(如:脚本语言、公共网关接口、组件等),可以创造出功能强大的网页。因而,超级文本标记语言是万维网(Web)编程的基础,也就是说万维网是建立在超文本基础之上的。超级文本标记语言之所以称为超文本标记语言,是因为文本中包含了所谓“超级链接”点。