<div style="position:absolute; width:100%; height:100%; z-index:-1; left:0; top:0;">
<img src="Images/logo.png" style="left:0; top:0; height:100%;width:100%">
</div> // 设置为最底层(通用)

<div id="formbackground" style="position:absolute; z-index:-1;"><img src="10.jpg" height="100%" width="100%"/></div>

<script type="text/javascript">
$(function(){
    $('#formbackground').height($(window).height());
    $('#formbackground').width($(window).width());
});
</script>// jquery书写方式

html5+css 图片自适应的更多相关文章

  1. 基于html5背景图片自适应代码

    基于html5背景图片自适应代码是一款背景不随滚动条滚动,会根据分辨率不同自动匹配对应的背景图片.效果图如下: 在线预览   源码下载 实现的代码. css代码: .jawbone-hero .jaw ...

  2. CSS 图片自适应容器

    https://www.jb51.net/css/660677.html 经常有这样一个场景,需要让图片自适应容器的大小. 1.img标签的方式 我们马上就能想到,把width.height 设置为1 ...

  3. 纯css 图片自适应居中

    html 结构 <div class="container"> <div class="content"></div> &l ...

  4. Css 图片自适应

    设置 CSS .container{ overflow:auto; } img{ width:100%; height:auto; overflow:hidden; } 设置 template < ...

  5. css控制图片自适应大小

    相信大家做网页时经常会碰到大分辨率的图片会把表格涨破以致漂亮的网页面目全非,但只要使用以下的CSS语句即可解决.      该CSS的功能是:大于600的图片自动调整为600显示. <style ...

  6. 漂亮的自适应宽度的多色彩CSS图片按钮

    一.素材               二.效果 三.CSS *{padding:0;margin:0} /*----------------------------------- 自适应宽度图片按钮 ...

  7. 【Python全栈-CSS】CSS实现网页背景图片自适应全屏

    CSS实现网页背景图片自适应全屏 功能:实现能自适应屏幕大小又不会变形的背景大图,而且背景图片不会随着滚动条滚动而滚动. 以下是用CSS实现的方法: <html> <head> ...

  8. css利用padding百分比实现图片自适应高度

    应用场景 宽高比率,实现图片自适应高度,防止图片加载过程高度为0,加载完图片高度撑起,它下面的div抖动问题 重点:CSS百分比padding都是相对宽度计算的 <div class=" ...

  9. css图片根据div宽高比例自适应

    1.div布局 <div class="card-img-show"> <div class="upload-img-conss" > ...

随机推荐

  1. KnockoutJS中父元素有click绑定引起checked绑定时失效

    KnockoutJS中的checked绑定如果父元素有click绑定,会出现状态点击没反应,实际KO的值已经变化的情况. 这种情况下应该在checked绑定的元素上除了阻止事件冒泡,另外还需要额外加上 ...

  2. (转)ViewPager,ScrollView 嵌套ViewPager滑动冲突解决

    ViewPager,ScrollView 嵌套ViewPager滑动冲突解决 本篇主要讲解一下几个问题 粗略地介绍一下View的事件分发机制 解决事件滑动冲突的思路及方法 ScrollView 里面嵌 ...

  3. spring mvc 参数

    Struts(表示层)+Spring(业务层)+Hibernate(持久层) Struts: Struts是一个表示层框架,主要作用是界面展示,接收请求,分发请求. 在MVC框架中,Struts属于V ...

  4. email 正则

    ^\w+((-\w+)|(\.\w+))*\@[A-Za-z0-]+((\.|-)[A-Za-z0-]+)*\.[A-Za-z0-]+$

  5. Maven项目java.lang.NoClassDefFoundError: Lorg/apache/log4j/Logger报错

    本文转载自:http://www.javaweb1024.com/info/894.jspx maven管理的项目,里面已经引入了log4j的包 maven引入如下: <dependency&g ...

  6. [git]rebase和merge

    转自:http://blog.csdn.net/wh_19910525/article/details/7554489 Git merge是用来合并两个分支的. git merge b # 将b分支合 ...

  7. MVC4 +EasyUI Tabs 使用

    Tabs 右键菜单功能实现 前端 <div id="tabs" class="easyui-tabs" fit="true" bord ...

  8. deep learning 练习1 线性回归练习

    线性回归练习 跟着Andrew Ng做做练习:http://openclassroom.stanford.edu/MainFolder/DocumentPage.php?course=DeepLear ...

  9. windows下CMake使用图文手册 Part 1

    维基百科介绍“CMake是个开源的跨平台自动化建构系统,它用配置文件控制建构过程(build process)的方式和Unix的Make相似,只是CMake的配置文件取名为CMakeLists.txt ...

  10. Windows消息大全(转)

    原链接地址: http://www.cnblogs.com/icebutterfly/archive/2011/08/05/2128864.html 表A-1 Windows消息分布 消息范围说 明 ...