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. 用74HC165读8个按键状态

    源:用74HC165读8个按键状态 源:74LV165与74HC595 使用 74LV165说明: 74LV165是8位并行负载或串行输入移位寄存器,末级提供互补串行输出(Q7和Q7).并行负载(PL ...

  2. Python3.x：chrome运行webdriver脚本提示--ignore-certificate-errors

    Python3.x:chrome运行webdriver脚本提示--ignore-certificate-errors 1,分析原因: 根本原因是Chromedriver和Chrome的版本不兼容: 网 ...

  3. 微信企业号的JAVA开发平台

    JEEWX 微信企业号平台 - 开源|免费 JEEWX 微信企业号平台,是基于JEECG3.6.3版本开发,采用插件方式提供,如果你的系统采用JEECG3.6.3版本开发,可以轻松集成JEEWX微信企 ...

  4. 老话题之C#写邮件发送

    唉!近来特么QQ邮件也犯二,突然间以前写的代码邮件发不出去,各种报错,无奈之下,换成了@163.com,可是报错依然,该开通(POP3/SMTP/IMAP)的都开通了!我勒了个草,像是在玩哥一样,还好 ...

  5. nginx之rewrite匹配需求

    现在需求如下: nginx上配有aaa.example.com的虚拟主机,现在需要将访问http://aaa.example.com/api/x.x/client/的请求转到http://bbb.ex ...

  6. params

    using System; using System.Collections.Generic; using System.Linq; using System.Text; namespace Ch06 ...

  7. 解题报告：hdu1012

    2017-09-07 21:46:53 writer:pprp 写一下水题,调节一下心情~ /* @theme: hdu 1012 u calculate e @writer:pprp @begin: ...

  8. windows系统下简单node.js环境配置 安装

    国内目前关注最高,维护最好的一个关于nodejs的网站应该是http://www.cnodejs.org/ windows系统下简单nodejs环境配置. 第一步:下载安装文件 下载地址:官网 htt ...

  9. LA 5713 秦始皇修路

    https://vjudge.net/problem/UVALive-5713 题意: 秦朝有n个城市,需要修建一些道路使得任意两个城市之间都可以连通.道士徐福声称他可以用法术修路,不花钱,也不用劳动 ...

  10. Oracle数据库报错: ORA-29275:部分多字节字符

    Oracle数据库报错: ORA-29275:部分多字节字符 就是你查出来的字符串(有汉字的)有可能会出问题, 在认为有问题的字段 用 to_nchar("字段")包起来 比如 你 ...