文档章节

CSS实现背景图尺寸不随浏览器缩放而变化的两种方法

壹峰
 壹峰
发布于 2017/02/04 23:18
字数 96
阅读 581
收藏 2

CSS实现背景图尺寸不随浏览器缩放而变化的两种方法

 

body{ margin:0; padding:0;} 
#con{ 
position:absolute; 
top:0; 
left:0; 
height:100%; 
width:100%; 
background-image:url("maskimg/star.jpg"); 
background-position: center 0; 
background-repeat: no-repeat; 
background-attachment:fixed; 
background-size: cover; 
-webkit-background-size: cover;/* 兼容Webkit内核浏览器如Chrome和Safari */ 
-o-background-size: cover;/* 兼容Opera */ 
zoom: 1; 
}

 

本文转载自:http://huqiji.iteye.com/blog/2300590

壹峰
粉丝 9
博文 595
码字总数 9582
作品 0
广州
其他
私信 提问
【CSS】背景基础知识

92038-106.jpg 添加背景图 用 background-image 属性,在元素的背景中添加图形。 background-image属性有一个值:url,后面跟着放在括号里的图形文件路径。 路劲可以是绝对url,也可以是相对...

KelvinZ
2017/11/27
0
0
布局的几种方式(静态布局、自适应布局、流式布局、响应式布局、弹性布局)

一、静态布局 页上的所有元素的尺寸一律使用px作为单位 1.布局特点 不管浏览器尺寸具体是多少,网页布局始终按照最初写代码时的布局来显示。 常规的pc的网站都是静态(定宽度)布局的,也就是...

神秘者007
2018/10/31
0
0
墙裂科普:移动端适配的基础概念

近几年移动端设备数量增长迅速,导致各种设备屏幕尺寸不一,分辨率也是不尽相同。 作为一个前端开发者,就不得不面对移动端页面适配的问题,而适配的终极目标,就是让页面能在不同尺寸,不同...

沃趣葫芦娃
2018/07/02
0
0
2018-05-21 响应式设计

1.什么是响应式设计? 让一个网站可以兼容不同分辨率的设备。 给用户更好的视觉使用体验。 2.诞生背景 在智能手机还未普及之前,平板电脑之类的终端更没有普及,我们所浏览的网页大多都是通过...

瑾瑜爱上猫
2018/05/21
0
0
css 背景background

属性是CSS中用于设置元素背景的属性,最简单的属 性名,是针对背景若干设定的合并简写,最早的CSS只能使用单一背景图片,而在现在却可以设置多个背景图片。 而不用图片的话,最早的backgroun...

阿豪boy
2018/02/13
19
0

没有更多内容

加载失败,请刷新页面

加载更多

IT兄弟连 HTML5教程 HTML5表单 小结及习题

小结 HTML表单提交的方法有get方法和post方法,get方法的作用是从指定的资源请求数据,post方法的作用是向指定的资源提交要被处理的数据。HTML表单一直都是Web的核心技术之一,有了它我们才能...

老码农的一亩三分地
19分钟前
12
0
向maven工程中导入自己封装好的jar包方法

1.打开cmd窗口 输入并执行:mvn install:install-file -DgroupId=com.test   -DartifactId=ptest -Dversion=0.1  -Dfile=E:\test\test-0.1.0.jar    -Dpackaging=jar注:Dgr......

gantaos
21分钟前
3
0
【jQuery基础学习】09 jQuery与前端(这章很水)

本文转载于:专业的前端网站➨【jQuery基础学习】09 jQuery与前端(这章很水) 这章主要是将如何将jQuery应用到网站中,或者说其实就是一些前端知识,对于我这种后端程序来说其实还是蛮有用的...

前端老手
33分钟前
11
0
深度科技与金山云完成兼容互认证 共同促进我国软件生态发展

近日,深度科技与金山云完成兼容互认证工作,经双方共同严格测试,深度操作系统ARM服务器版软件V15与金山云分布式数据库软件DragonBase V1.0相互兼容、稳定运行,可以为企业级应用提供全面保...

后浪涛涛
33分钟前
7
0
Less导入选项

Less 提供了CSS @import CSS规则的几个扩展,以提供更多的灵活性来处理外部文件。 语法: @import (keyword) "filename"; 以下是导入指令的相关详情: reference,使用较少的文件但不输出。 ...

凌兮洛
49分钟前
13
0

没有更多内容

加载失败,请刷新页面

加载更多

返回顶部
顶部