浏览器对可见元素的默认高度

最新推荐文章于 2023-05-31 21:55:52 发布
转载 最新推荐文章于 2023-05-31 21:55:52 发布 · 286 阅读 · 0 ·
CC 4.0 BY-SA版权
原文链接：https://my.oschina.net/u/1992917/blog/350445
文章标签：

#python

本文探讨了不同浏览器对可见元素默认高度处理的区别。IE6至IE8默认高度为2px，即使设置高度为0仍存在高度；Firefox和Chrome则将可见元素默认高度设为0。这些特性对网页布局和样式调整具有重要意义。

摘要生成于 C知道 ，由 DeepSeek-R1 满血版支持， 前往体验 >

2019独角兽企业重金招聘Python工程师标准>>> hot3.png

IE6,7,8对可见元素的默认高度是2px，因此就算设置了height：0，也是有高度了，只有通过display：none使其变为不可见元素。

而firefox和chrome对可见元素的默认高度是0

转载于:https://my.oschina.net/u/1992917/blog/350445

最全的CSS浏览器兼容问题整理(IE6.0、IE7.0 与 FireFox)(收藏)
李蓝箫
02-28 4135
CSS 对浏览器的兼容性有时让人很头疼,或许当你了解当中的技巧跟原理,就会觉得也不是难事,从网上收集了IE7,6与Fireofx的兼容性处理方法并整理了 一下.对于web2.0的过度,请尽量用xhtml格式写代码,而且DOCTYPE 影响 CSS 处理,作为W3C的标准,一定要加DOCTYPE声 名.    常见问题1.div的垂直居中问题vertical-align:midd
js获取浏览器高度 窗口高度 元素尺寸 偏移属性的方法
11-27
`window.innerHeight`是Firefox和Chrome支持的属性，用于获取浏览器窗口可见内容的高度，同样，`window.innerWidth`则用于获取宽度。在Internet Explorer中，可以使用`document.documentElement.clientHeight`和`...
让html元素随浏览器的大小自适应垂直居中的实现方法
11-24
表格可以实现td中的元素垂直居中显示，但是前提条件必须定义td的高才可行。 但是很多时候会用到元素跟随浏览器的大小垂直居中，如在制作展示官网、活动展示网等等的时候。 问题： 实现div垂直居中并在缩放浏览器尺寸的时候仍然居中。 解决方案： 1、浏览器可视区域的高度-元素的高度/2 = 元素距离浏览器可视区域顶部的距离。 (bodyHeight – divHeight)/2 2、浏览器可视区域如果小于元素的高度，即元素距离浏览器可视区域顶部的距离为零。 3、onresize()当浏览器的尺寸改变的时候触发事件。使用onresize()每次改变的时候，重新计算一下元素到顶部的距离。 实现代码：
chrome,ff浏览器默认行高
demographic2017的博客
05-12 671
chrome,ff浏览器默认行高不同，需要初始化。 chrome下是16px ff是18px 设置不同行高，auto、18px 16px 1 <!doctype html> 2 <html lang="en"> 3 <head> 4 <meta charset="UTF-8"> 5 <ti...
js获取屏幕有关数据
✿孙小喵 ❤ 苏大宝✿
08-10 438
var w = document.documentElement.clientWidth; var h = document.documentElement.clientHeight; JS获取屏幕高度var s = ""; s += " 网页可见区域宽："+ docume
为什么浏览器默认p的高度是21px
dragoo1的专栏
09-24 901
<html> <head> <meta charset="utf-8"> </head> <body> <p style="background-color: #407bbd;padding: 0 0 0 0;margin: 0 0 0 0;">Apple</p> </body> </html> 无论chrome还是firefox，盒模型的高度都是21px，但字体默认是1em=16.
根据浏览器屏幕大小高度自适应
12-10
这个JavaScript属性返回元素的可见高度，包括内边距，但不包括滚动条和边框。对于DOM元素，例如获取页面可视区域的高度，我们可以使用`window.innerHeight`或`document.documentElement.clientHeight`。这对于动态...
子元素div高度不确定时父div高度如何自适应
09-25
由于CSS的盒模型和HTML结构的特性，父元素div默认情况下并不会根据子元素div的浮动来改变自身的高度，这导致了父元素无法自适应子元素的高度。为了解决这一问题，可以通过以下几种方法来实现父div的高度自适应。 第...
Iframe实现跨浏览器自适应高度解决方法
09-04
注意到最初代码中`$(document).height()`被替换为`$("#content").height()`，这是因为`document.height`会返回整个文档的最大高度，包括不可见部分，而我们只关心可见内容的高度，所以用`#content`元素的高度更为...
经典的IE6的高度问题-div默认存在3个像素高
09-25
总的来说，处理IE6的高度问题需要对浏览器的兼容性和CSS hack有一定的理解，以确保在各个浏览器中保持一致的布局效果。尽管现在IE6的使用率已经大大降低，但在维护旧项目或支持老用户时，了解这些问题及其解决方案...
IE兼容-div默认高度bug
iteye_6992的博客
03-08 140
IE6下默认的字体大小至少是12px；当你设置的div的高度小于这个值时，IE6会自动调节它默认的高度。要解决这个问题，可以在设置div高度的同时，设置字体的大小，也可以通过设置overflow：hidden来使div的高度显示为设定的值；示例代码如下： &lt;style&gt;div{  width:300px;  height:2px;  background-color:#000; ...
div+css自适应浏览器高度和解除元素浮动
zxx1989的博客
04-29 176
关于如何使背景图片自适应屏幕的问题，每个论坛上都有许多人在讨论，但是由于大家的思路不同，想要实现的效果具体也不同，所以，光copy别人的方法是行不通的，还是综合别人的经验，自己琢磨比较靠谱~   先说说我遇到的问题吧： 在body元素中定义了一些div块  具体如下（每个标签内的内容省略，仅做必要说明） &lt;&lt;body&gt; &lt;div id="page"&gt; &l...
前端-CSS-从入门到精通
m0_70903072的博客
05-31 647
link与@import引入方法的区别 1. 本质的差别：link属于XHTML标签，而@import完全是CSS提供的一种方式... margin塌陷 上面的盒子给下margin，下面的盒子给上margin，按大的取值父子盒子都设置margin,父盒子和子盒子之间的margin重叠 高度塌陷问题 当父元素未设置高度时，所有子元素浮动后，造成子元素脱离文档流进而无法把父元素撑开，父元素高度为0产生高度塌陷
浏览器可视区域及容器的宽高
一只卑微的菜狗的博客
10-22 1083
获取浏览器可视区域的宽度高度，容器的宽高
JavaScript获取浏览器可视区域的宽高
weixin_43852569的博客
10-10 3409
JavaScript获取浏览器可视区域的宽高 在做项目的时候，我们常常需要对项目做一些优化，来提升页面响应的速度，比如进入可视区域后再发送请求获取数据或者是填充模板，这个时候就需要能够获取到浏览器的可视区域的宽高： // 获取浏览器可视区域宽高（兼容性比较好，不包括工具栏和滚动条） var browserWidth = window.innerWidth || document.documentElement.clientWidth || document.body.clientWidth; var bro
(document).height()与$(window).height()
aijue2015的博客
01-06 415
jQuery(window).height()代表了当前可见区域的大小，而jQuery(document).height()则代表了整个文档的高度，可视具体情况使用. 注意当浏览器窗口大小改变时(如最大化或拉大窗口后) jQuery(window).height() 随之改变，但是jQuery(document).height()是不变的。 $(document).sc...
JS获取浏览器中的各种宽高值
mr_minlong的专栏
09-05 2610
width：clientWidth：对象实际内容的宽度，不包含边线，最大不超过视口宽度 offsetWidth：对象实际宽度，包含边线，最大不超过视口宽度 scrollWidth：对象实际宽度，不包含边线，可超过视口宽度height：（都可超过视口高度）clientHeight：对象实际内容的高度，不包含边线 offsetHeight：对象实际高度，包含边线 scrollHeight：对象实
DIV高度自适应浏览器高度方法
热门推荐
Mr.Starl
10-15 3万+
*{ margin: 0; padding: 0; } html, body{ width: 100%; height: 100%; } div{ position: absolute; top: 0; left: 0; width: 100%; min-height: 100%; height: auto; ...
分析div自动适应浏览器的高度
a510750的专栏
06-28 2456
前端人员之间有一个普遍存在的问题，如何让一个div的高度自动延伸到浏览窗口100%的高度,在布局中，我们有时会用到高度自适应，例如，我们定义了一个 div，并且希望它的高度为窗口高度的100% ，那么我们该如何编写代码呢？用height:100%就可以了。但要注意的是，浏览器对css的解析方式有一点差异。我们需要弄清楚100% 到底是谁占谁的100%，让我给你另外一种方式来思考HTML，几乎每一个H
获取元素可视区域内的高度
最新发布
02-26
要获取元素在浏览器可视区域内的可见高度，可以通过以下步骤实现： ### 核心原理 通过比较元素的边界位置和视口的边界位置，计算两者重叠的部分的高度。 ### 实现代码 ```javascript function getVisibleHeight...
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

当前余额3.43元 前往充值 >
需支付：10.00元
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付元
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明：

1.余额是钱包充值的虚拟货币，按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载，可以购买VIP、付费专栏及课程。

余额充值