html – 没有固定高度的滚动条/带滚动条的动态高度

栏目: Html · 发布时间: 7年前

内容简介:你必须指定一个固定的高度,你不能使用100%,因为没有什么可以比较,如在height = 100%的什么?编辑小提琴:

我有这个HTML结构:

<div id="body">
    <div id="head">
        <p>Dynamic height without scrollbar</p>
    </div>
    <div id="content">
        <p>Dynamic height with scrollbar</p>
    </div>
    <div id="foot">
        <p>Fixed height without scrollbar</p>
    </div>  
</div>

我想在主要部分(#body)中没有溢出的三个部分.所以我在中间需要一个滚动条.

我试过这个CSS:

#content{
    border: red solid 1px;
    overflow-y: auto;
}

和这个:

#content{
    border: red solid 1px;
    overflow-y: auto;
    height: 100%;
}

但他们都不工作.

我在 JSFiddle 做了一个例子.

我可以只用CSS和HTML吗?我宁愿避免使用Javascript.

你必须指定一个固定的高度,你不能使用100%,因为没有什么可以比较,如在height = 100%的什么?

编辑小提琴:

http://jsfiddle.net/6WAnd/4/

代码日志版权声明:

翻译自:http://stackoverflow.com/questions/10980822/scrollbar-without-fixed-height-dynamic-height-with-scrollbar


以上就是本文的全部内容,希望本文的内容对大家的学习或者工作能带来一定的帮助,也希望大家多多支持 码农网

查看所有标签

猜你喜欢:

本站部分资源来源于网络,本站转载出于传递更多信息之目的,版权归原作者或者来源机构所有,如转载稿涉及版权问题,请联系我们

阿里巴巴正传:我们与马云的“一步之遥”

阿里巴巴正传:我们与马云的“一步之遥”

方兴东、刘伟 / 江苏凤凰文艺出版社 / 2015-1 / 45.00

十几年来,方兴东与马云每年一次,老友聚首,开怀畅谈,阿里上市前,作者再次与马云深度对话,阿里上市前的布局,深入探讨了一系列人们关心的话题。 本书忠实记录了阿里壮大、马云封圣的历史。作者通过细致梳理和盘点,对阿里巴巴的15年成长史进行了忠实回顾。从海博翻译社到淘宝网,从淘宝商城到天猫,从支付宝到阿里云计算,从拉来软银的第一笔投资到纽交所上市,作者对其中涉及到的人物、细节都有生动展现;对于马云、......一起来看看 《阿里巴巴正传:我们与马云的“一步之遥”》 这本书的介绍吧!

HTML 压缩/解压工具
HTML 压缩/解压工具

在线压缩/解压 HTML 代码

JS 压缩/解压工具
JS 压缩/解压工具

在线压缩/解压 JS 代码

图片转BASE64编码
图片转BASE64编码

在线图片转Base64编码工具