网页背景图是我们常用的功能,一般来说。给网页加一个背景图,只要在网页的body标签中加入css属性就行。

代码如下:<body style="background-image:url(图片路径)">

底部的部分,我们要加入背景图,首先要看图片的高度。在高度合理的范围内加入div

<body style="background-image:url(顶部图片路径)">

<div class=“banner”></div>

<div class=“connet”></div>

<div class=“foot”></div>

</body>

如果要插入的图片高度不高于foot,可以为foot加入背景图,如果高了,就为 foot和connet 外面在包一个div。代码如下

<body style="background-image:url(顶部图片路径)">

<div class=“banner”></div>

<div style="background:bottom center url(底部背景图路径) no-repeat; width:100%;">

<div class=“connet”></div>

<div class=“foot”></div>

</div>

</body>

css为网页顶部和底部都加入背景图的更多相关文章

  1. CSS Div固定在网页顶部、底部、左侧、右侧

    Div固定在网页顶部 .header { width:100%; height:80px; background-color:#FAFAFA; position:fixed; top:; left:; ...

  2. jQuery&CSS 顶部和底部固定浮动工具栏 兼容IE6

    http://www.cnblogs.com/lhj588/archive/2013/04/02/2994639.html —————————————————————————————————————— ...

  3. ListView去除顶部和底部边缘阴影(亲测4.4及以前的版本都适用)

    ListView滑动到顶部和底部时出现的阴影消除方法:android2.3以前用android:fadingEdge="none"android2.3以后用android:over ...

  4. div+css对网页进行布局

    div+css对网页进行布局 首先在页面整体上进行div标签划分内容区域,然后再用css进行定位,最后再对相应的区域添加内容. 1.用div将页面划分 拿到网站页面图后,首先将分析页面分为哪几块,然后 ...

  5. Android ScrollView监听滑动到顶部和底部的两种方式(你可能不知道的细节)

    Android ScrollView监听滑动到顶部和底部,虽然网上很多资料都有说,但是不全,而且有些细节没说清楚 使用场景: 1. 做一些复杂动画的时候,需要动态判断当前的ScrollView是否滚动 ...

  6. 前端开发css实战:使用css制作网页中的多级菜单

    前端开发css实战:使用css制作网页中的多级菜单 在日常工作中,大家都会遇到一些显示隐藏类菜单,比如页头导航.二维码显示隐藏.文本提示等等......而这些效果都是可以使用纯css实现的(而且非常简 ...

  7. JS网页顶部弹出可关闭广告图层

    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/ ...

  8. DIV+CSS常用网页布局技巧!

    以下是我整理的DIV+CSS常用网页布局技巧,仅供学习与参考! 第一种布局:左边固定宽度,右边自适应宽度 HTML Markup <div id="left">Left ...

  9. link标签和script标签跑到body下面,网页顶部有空白

    用UltraEdit的16进制编辑模式查看代码,都是EF BB BF开头的,说明都是带BOM的.我手动的将所有文件转成UTF-8 without BOM.页面终于正常了.link,script标签乖乖 ...

随机推荐

  1. Android入门——UI(2)

    介绍SeekBar拖动条控件.ProgressBar进度条控件.DatePicker日历控件.TimePicker时间控件 <?xml version="1.0" encod ...

  2. MarkDown使用 (一)

    MarkDown的数学公式输入 MarkDown的数学公式输入 1.如何插入公式 LaTeX的数学公式有两种:行中公式和独立公式.行中公式放在文中与其它文字混编,独立公式单独成行. 行中公式可以用如下 ...

  3. 利用Console来调试JS程序、Console用法总结

    http://blog.163.com/zhangmihuo_2007/blog/static/27011075201452522824347/ http://blog.163.com/zhangmi ...

  4. Codeigniter使用phpexcel

    1. 去 http://phpexcel.codeplex.com/ 下载phpexcel源码,解压缩后把phpexcel/Classes里的PHPExcel文件夹和PHPExcel.php复制到CI ...

  5. java——%

    %; //结果为1 %; //结果为-1 ; //结果为1.2000000000000002

  6. JavaScript 鸭子模型

    Javascript:由 “鸭子类型” 得出来的推论 背景 学动态语言的都知道一句话:“如果它走起来像鸭子,而且叫起来像鸭子,那么它就是鸭子”,Javascript也支持鸭子类型,下文就说说鸭子类型在 ...

  7. Windows phone 8.1 MessageBox 变了哦!

    using Windows.UI.Popups; public async void MessageBoxShow(string content, string caption) { MessageD ...

  8. Windows Phone

    错误: DEP6100 : 引导阶段“正在连接到设备”出现以下意外错误: SmartDeviceException - Windows Phone IP over USB Transport (IpO ...

  9. 阿里云ECS每天一件事D9:nginx1.7整合tomcat8.0

    仅通过8080端口访问jsp显然不是一算是一个太好的方法,可以使用nginx的proxy_pass子模块,实现nginx转发jsp请求至tomcat. 典型的配置如下: server { listen ...

  10. HDU 5729 Rigid Frameworks(连通性DP)

    [题目链接] http://acm.hdu.edu.cn/showproblem.php?pid=5729 [题目大意] 给出一个n*m的方格框,可以在单位矩形中添加两种对角线的线,使得其变得稳定,问 ...