div结构如下:

<div class="mainbody">

  <div class="left">导航</div>

  <div class="right">内容</div>

</div>

让导航的高度根据内容层的高度自动调整的Css样式:

.mainbody{height:100%;overflow:hidden;}

.left{ height:100%;      margin-bottom:-99999px;     padding-bottom:99999px;}

这样就可以实现如题所说的功能了

左边的div导航根据右部div内容的高自动调整的更多相关文章

  1. CSS如何实现”右部宽度固定,左部自适应“的布局

    吃过晚饭后,开始刷前端笔试题,却遇到了一道CSS难题——使用CSS实现左部自适应.右部固定宽度为200px的布局.当时第一眼看到题目时,以为只是一道很简单的题目.不就是定义两个左浮动的div,右部的宽 ...

  2. 实现一个div,左边固定div宽度200px,右边div自适应

    实现一个div,左边固定div宽度200px,右边div自适应<div class= "container"> <div class="left&quo ...

  3. __x__(30)0908第五天__导航条的练习 <div>版本

    效果图:  html源代码: <!doctype html> <html> <head> <meta charset="utf-8" /& ...

  4. div+css实现的左右两个等高div

    工作当中我们经常会有这样的需求,尤其是在一些内容页面或者网站后台管理页面:左边的div的高度会随着右边的div的内容的增加儿增加,右边div的高度也会随着左边div的内容的增加而增加,也就是左右两侧两 ...

  5. DIV+CSS布局问题:一个宽度不确定的DIV里面放三个水平对齐的DIV,左右两个DIV宽度固定为150px,中间那个DIV充满剩余的宽度

    一个入门的DIV+CSS布局问题:一个宽度不确定的DIV里面放三个水平对齐的DIV,左右两个DIV宽度固定为150px,中间那个DIV充满剩余的宽度. 说明:代码非真实情况下使用,所以直接简单. 没耐 ...

  6. DIV布局之道二:DIV块的嵌套,DIV盒子模型

    本文讲解DIV块布局的第二种使用方式:嵌套.“DIV嵌套”在有些文献中也被称为“盒子模型”,说的通俗一点就是嵌套(一个大的DIV块内部又包含一个或多个DIV块). 请看如下代码: CSS部分: CSS ...

  7. xHTML+div布局:三个div,两边div宽度固定,中间div宽度自适应

    xHTML+div经常考题:三个div,两边div宽度固定,中间div宽度自适应. 和大家分享一个实现方式: 1.html代码 <div class="dyleft"> ...

  8. html中div获取焦点,去掉input div等获取焦点时候的边框

    经测试只有在IE chrome才会在获取焦点时有边框 使用CSS div{ outline:none; } DIV焦点事件详解 --[focus和tabIndex]​ 摘自:http://my.osc ...

  9. js在一个div里面移动其子div

    var ChildDiv = $("#cid"); var width = 0; //鼠标点击子div的地方和子div的左边边距距离 var height = 0; //鼠标点击子 ...

随机推荐

  1. BigDecimal处理加减乘除

    public static void main(String[] args) { BigDecimal totalDoneAmt = new BigDecimal(2); Double d1 = ad ...

  2. 20145322第九周JAVA程序设计基础学习总结

    20145322第九周JAVA程序设计基础学习总结 JDBC简介 JDBC全名Java DataBase Connectivity,是java联机数据库的标准规范.它定义一组标准类与接口,应用程序需要 ...

  3. (java) 第二周学习总结

    在java源代码中,每个变量都必须声明一种类型(type).有两种类型:primitive type和reference type.引用类型引用对象(reference to object),而基本类 ...

  4. HandyJSON第三方库的日常使用与错误记录

    一.错误提示 1.更新Xcode10.2,Swift5.0出现错误提示 Undefined symbols for architecture x86_64: "_swift_getField ...

  5. 快用Visual Studio(五)- 语言特性

    HTML 自带Emment $ SHIFT + OPTION + F:格式化代码 其他语言特性提示 CSS & LESS hover属性,提示样式对象标签 $ CMD + SHIFT + O: ...

  6. 1.1_Django简介及安装

    Django的安装 Django安装 文档:https://docs.djangoproject.com/en/1.8/ pip install django 可以到这个网站查看可用的django版本 ...

  7. Sublime 快捷键及使用技巧

    (1)打开刚刚关闭的窗口:ctrl+shift+T 默认设置. (2)全屏显示:F11 默认设置. (3)多处选择相同的词:Ctrl+D,回退选择Ctrl+U 默认设置,非常有用,可以试试. (4)取 ...

  8. 爬虫bs4案例

    案例:使用BeautifuSoup4的爬虫 我们以腾讯社招页面来做演示:http://hr.tencent.com/position.php?&start=10#a 使用BeautifuSou ...

  9. 线程实现Runnable接口比继承Thread的优势

    1.适合多个相同程序代码的线程去处理同一资源,把虚拟CPU(线程)同程序的代码.数据有效分离,较好地体现了面向对象的设计思想.2.可以避免由于java单继承特性带来的局限.3.增强了程序的健壮性,代码 ...

  10. select * from table_name where 1=1的

    我们先来看看这个语句的结果:select * from table where 1=1,其中where 1=1,由于1=1永远是成立的,返回TRUE,条件为真:所以,这条语句,就相当于select * ...