如果将div 的height 设置为固定的像素值,在不同分辨率的显示屏上,会看到div 在浏览器上的高度不一致。可以以百分比的形式设置div 的高度。注意,这个百分比是针对div 的上一层标签而言的,如果当前div的上一层标签的height 为 100px,那么当前标签设置hight 为 100% 时,它的高度也就是100px。

HTML 页面中,html 和 body 标签的height是auto的。如果要设置div 的高度跟浏览器一致,则要先将html 和 body 的高度设置为100%。

如果设置了父类标签的百分比高度,但是当前div 的高度还是不能以百分比的形式放大缩小时,要考虑当前div 的子类标签的高度是否都是以固定像素定义的。如果是,则也要统一改成以百分比的形式定义高度。

设置div 高度 总结的更多相关文章

  1. 如何设置div高度为100%

    div高度通常都是固定值,直接将div高度设为100%是无效的,那么如何设置才能有效呢? 直接给div设置height:100%即可,无效的原因一定是父元素的高度为0,最常见的就是给body的直接元素 ...

  2. css设置div高度与宽度相等的一种方法

    div.category{ width:33%; padding:33% 0 0; } 1.关键在padding:33% 0 0这句代码,通过设置padding-top与宽度相等(padding使用百 ...

  3. 设置Div多行文本超出时,以省略号代替

    这个文章不错 http://www.css88.com/archives/5206 css中有一个属性: text-overflow,可以设置文本超出指定长度后的文本截取样式. 下面是从 w3shco ...

  4. 外部div自适应内部标签的高度,设置最小高度、最大高度

    一.div自适应高度:在前端开发中经常需要让外层的div自动适应内部标签和内容的高度,内部标签可能是<div>.<ul>.<ol>或者文字等各种内容.造成外层的di ...

  5. 设置DIV根据内容自动调整高度的三个方法

    Div即父容器在Firefox.Chrome.Safari中不会根据内容自动调节高度,我们看下面的HTML代码: <divid="main"><divid=&qu ...

  6. HTML学习之给div高度设置百分比不生效的问题

    这几天在学习HTML的知识,今天想做一个极为简单的页面,就是分为头部,内容和底部,本来用三个div即可,可是给div高度设置百分比时发现不生效,具体页面如下,非常简单. 下面是html部分: < ...

  7. 【CSS系列】height:100%设置div的高度

    一.div设置百分百高度实现描述 在html布局中body内第一个div盒子对象设置100%高度height样式,是无法成功显示100%高度的.这个是因为body高度默认值为自适应的,所以及时设置bo ...

  8. 设置div自适应高度滚动

    <body> <div id="divc" style="overflow: auto;"> </div> <a id ...

  9. 如何让div中的span垂直居中 ----height:100%设置div的高度

    如果div中只有一个span一个元素,可以使用line-height.如果div中还有其他元素,可以设置span的css如下: .span{ position: absolute; top: 50%; ...

随机推荐

  1. OSPF进程号的意义及多进程OSPF

    OSPF进程号的意义及多进程OSPF—吴锦霖分享    1. OSPF进程号的概念 在配置OSPF时,我们采用的是router ospf命令,在该命令后面需要加上这个OSPF进程的进程号(Proces ...

  2. Spring-Cloud-Config学习笔记(一):使用本地存储

    简介 Spring Cloud Config为分布式系统中的外部配置提供服务器和客户端支持.使用Config Server,您可以为所有环境中的应用程序管理其外部属性.它非常适合spring应用,也可 ...

  3. AT&T汇编指令

    GAS中每个操作都是有一个字符的后缀,表明操作数的大小. C声明 GAS后缀 大小(字节) char b 1 short w 2 (unsigned) int / long / char* l 4 f ...

  4. iOS - 提示用户升级版本并跳转到AppStore

    一.问题:自己做提示用户升级? 由于苹果做了自动升级,所有只要在应用程序中出现从AppStore检查版本更新,或者出现任何有关升级的提醒都会被拒,但是如果必须添加升级提示的话,可以配合后台通过添加AP ...

  5. gym 101858

    我这个傻逼被治了一下午. 大好的橘势,两个小时6T,去看L,哇傻逼题.然后我跑的最短路T到自闭 最后十几分钟去想了下A,一直在想如何表示状态..就是想不到二进制搞一下... 然后游戏结束了..以后我就 ...

  6. linux的基本操作(文件压缩与打包)

    文件的压缩与打包 在windows下我们接触最多的压缩文件就是.rar格式的了.但在linux下这样的格式是不能识别的,它有自己所特有的压缩工具.但有一种文件在windows和linux下都能使用那就 ...

  7. vue 里filter的基本用法

    filter是和data  computed   methods watch一样,都是new Vue()的参数. 用于对简单数据的处理,和computed有冲突,所以从vue2.0后就对filter做 ...

  8. python API whoami

    import getpass print getpass.getuser() See the documentation of the getpass module. getpass.getuser( ...

  9. 一些关于SQL优化的总结

    由于这个项目一直都是mysql所以写点mysql的 1.数据存储引擎的选择,MyISAM 和 InnoDB 的选择 InnoDB 一般都会选择这个,但是如果真的涉及到一些不涉及增删的表,可以考虑下My ...

  10. 利用XML语法 SQL 列转行

    --行转列 固定xml语法 declare @xml xml ; set @xml=cast('<v>2</v><v>4</v><v>3&l ...