网页背景图是我们常用的功能，一般来说。给网页加一个背景图，只要在网页的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. c#操作word文档之简历导出

    前言 1.写这个功能之前,我得说说微软的这个类库,用着真苦逼!是他让我有程序猿,攻城尸的感觉了.首先这个类库,从没接触过,方法与属性都不懂,还没有提示.神啊,我做这功能真是一步一卡,很潇洒啊. 2.这 ...

  2. Java基础之静态变量

    public class StaticVariable { public static void main(String[] args) { Person p1 = new Person(); Per ...

  3. jquery的$().each,$.each

    在jquery中,遍历对象和数组,经常会用到$().each和$.each(),两个方法.两个方法是有区别的,从而这两个方法在针对不同的操作上,显示了各自的特点. $().each,对于这个方法,在d ...

  4. poj 1321 棋盘问题 递归运算

    棋盘问题 Time Limit: 1000MS   Memory Limit: 10000K Total Submissions: 19935   Accepted: 9933 Description ...

  5. 帝国cms中上一篇与下一篇个性化灵动标签调出

    这里的上下篇是用灵动标签制作,可以更为个性化 下一篇 <a href="<?phpecho $bqsr[titleurl];$next='true';?>"> ...

  6. 使用 Java 实现 Comet 风格的 Web 应用

    参考这个: http://www.ibm.com/developerworks/cn/web/wa-cometjava/

  7. WPF：在XmlDataProvider上使用主-从绑定（Master-Detail Binding）

    原文 http://www.cnblogs.com/mgen/archive/2011/06/19/2084553.html 示例程序: 如上程序截图,一目了然典型的主从模式绑定应用,如果里面的数据不 ...

  8. Html 小插件3

    搜狗搜索框代码 <script>function verifyquery(form){if(form.sogou_drop.value==2){form.insite.value='';} ...

  9. 脑波设备mindwave数据流二次开发示例

    数据流开发神念科技提供了两个文件ThinkGearStreamParse.h和ThinkGearStreamParse.cpp两个文件,主要接口为: 宏定义: /* Data CODE definit ...

  10. VS2010/MFC对话框：字体对话框

    字体对话框) 在上一节为大家讲解了文件对话框的使用,本节则主要介绍字体对话框如何应用. 字体对话框的作用是用来选择字体.我们也经常能够见到.MFC使用CFontDialog类封装了字体对话框的所有操作 ...