在ie下实现position:fixed效果最简单有效的途径

最新推荐文章于 2022-05-17 21:32:22 发布

最新推荐文章于 2022-05-17 21:32:22 发布 · 768 阅读

文章标签：

#IE #HTML #浏览器

Javascript 专栏收录该内容

6 篇文章

订阅专栏

本文介绍了一种兼容IE6的fixed定位方案。通过设置DOCTYPE并利用条件注释为IE6提供特定样式，确保了fixed定位在现代浏览器及IE6上的正确显示。

有个限制，一定要设置一下DOCTYPE

  
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">

给需要fixed的元素加个类名class='fixed'
普通的style里面
div.fixed {
position; fixed
}
给支持fixed的浏览器
然后加上

  
<!--[if lte IE 6]>
<style type="text/css">
html, body
	{
	height: 100%;
	overflow: auto;
	}
div.fixed {
	position: absolute;
}
</style>
<![endif]-->

确定要放弃本次机会？

福利倒计时

: :

立减 ¥

普通VIP年卡可用

立即使用

iteye_18941

关注关注

0
点赞
踩
0

收藏

觉得还不错? 一键收藏
0
评论
分享

复制链接

分享到 QQ

分享到新浪微博

扫一扫
举报

举报

专栏目录

【CSS position 属性】static、relative、fixed、absolute 、sticky详细介绍，多层嵌套定位示例

waterlin2011的博客

06-10

1485

通过合理运用 position 属性及其值，你可以构建出既美观又实用的页面布局。关键是理解每种定位方式的特性，并根据实际需求灵活组合使用。

在IE浏览器下fixed定位容器随着滚动条出现抖动问题（实测有效）

2201_75705263的博客

10-16

662

在ie浏览器下固定定位随着滚动条晃动；如何阻止滚动事件；实现滚动放大缩小照片

参与评论您还未登录，请先登录后发表或查看评论

position在IE下的问题

weixin_30323631的博客

12-04

278

盒子设置position:absolute;后,子盒子的浮动可以不做清除浮动处理,同样,使用fixed,子盒子也不需要做清除浮动的处理在IE7下(据说IE6也不行),盒子设置overflow:hidden;对于有relative的子盒子是没有效果的　　　　　　　　　　转载于:https://www.cnblogs.com/missjingjing/p/10062925.html...

模态框在IE下的问题，即position:fixed在IE下不兼容的处理方式

weixin_34245082的博客

06-28

286

　　项目中遇到的问题，模态框在IE下总出现如图所示双层遮罩框，经排查发现是由于bootstrap里写的modal的样式里position:fixed不兼容IE的原因，导致铺不满整个窗口。　　解决方案：在项目文件的公共样式里给“.modal”样式加上：position:-ms-page，效果即正常，可以让想要的modal fade平铺满整个窗口 .modal{ position:-ms-...

IE浏览器弹窗在position：fixed下左右布局中的问题

weixin_41778380的博客

12-22

586

在chrome浏览器下开发，弹窗居中的css只需 position: fixed; bottom: 0; top: 0; left:0; right:0; margin: auto; 但是这样的写法在IE浏览器中会造成弹窗左右不居中的情况，换种写法，如下 position: fixed; bottom: 0; top: 0; left:50%; transform:translateX(-50%) margin: auto; 即：整体向左移动50%，然后弹窗本身在向右偏移50%，即可实现左右居中！ .

position属性

weixin_56815226的博客

05-17

279

1.static 默认属性，即没有定位，元素出现在正常的流中。因此这种定位就不会受到top、bottom、left、right的影响。 2.fixed（脱离文档流） fixed定位是指元素的位置相对于浏览器窗口是固定位置。（ fixed定位在IE7和IE8下需要描述！DOCTYPE才能支持） 3.relative 相对自身本来的位置。并且其元素移动后原来占据的位置仍然存在，并不影响其他元素。 4.absolute（脱离文档流）相对设置了非static属性的父级元素，若无，则相对于body

IE6不兼容position:fixed的多种解决方案分析与总结

guaguapi_ndsc的专栏

09-10

939

目录引言解决方案基本思路 1、视窗与网页的区别 2、position:fixed固定定位的含义 3、position:fixed固定定位与position:absolute绝对定位的区别 4、用position:absolute绝对定位模拟position:fixed固定

完美兼容IE6的position_fixed实现方案

`position_fixed` 是前端开发中一个非常经典且具有挑战性的技术主题，尤其在处理老旧浏览器如 IE6 的兼容性问题时显得尤为重要。该标题所指的“position_fixed”即 CSS 中的 `position: fixed` 属性值，它用于实现...

CSS中position属性之fixed实现div居中

09-03

总的来说，通过理解并应用`position: fixed`以及相关的CSS布局技巧，我们可以轻松地实现div在浏览器窗口中的居中效果。这在构建响应式设计或者需要元素始终显示在可视区域中央的场景中尤其实用。

css中让元素吸顶除了position: fixed;还有什么

最新发布

09-09

` 在滚动过程中切换定位方式，实现吸顶效果，这与 `position: fixed;` 的直接全局固定不同[^2]。综上所述，`position: sticky;` 是实现吸顶效果的最佳替代方案，简单高效。如需兼容性或特殊控制，可结合JavaScript...

postion：fixed

01-05

### CSS `position: fixed` 属性详解 #### 一、基本定义与语法结构 CSS 中的 `position: fixed` 是一种定位方式，用于将元素相对于视口...这段代码利用了转换函数 `translate()` 实现了一个简单而有效的居中方案。

ie6,ie7,ie8完美支持position:fixed的终极解决方案

10-25

ie6对position:fixed不支持，网上有很多解决方法，有的在ie6,ie7上调试成功后，在ie8上又不好使，div层还是跟随滚动条浮动；以下总结方法，在ie6,ie7,ie8上都调试成功，且页面滚动条滚动时，效果还挺好，div层并不会闪烁。

解决IE不支持position:fixed问题

hmonkey915的专栏

02-28

4131

页面上需要一个固定位置的块，不论页面怎么滚动，始终停在它的位置，比如“返回顶部”、“给建议”、“分享按钮”、“广告”等等。css中有position: fixed;可以直接用。IE确不支持，有没有好的办法解决评论 (1) • 分享 • 链接 • 2012-02-03 0 这个兼容性问题通常是采用JS+绝对定位方式处理 – xiaomi 2012-02-0

解决IE6浏览器下position:fixed固定定位问题

我的地盘

02-28

1279

像你所遇到的问题一样， IE6浏览器有太多的bug让制作网页的人头疼。这篇文章介绍的是介绍的是如何解决IE6不支持position:fixed;属性的办法。如果我们需要做某个元素始终位于浏览器的底部，不会因为浏览器窗口的缩放和滚动条的滚动而变化，那个肯定是想到的用position:fixed生成绝对定位，只要设置这个CSS属性就能达到刚刚的需求。当其他浏览器都正常显示的时候，只有IE6不那么完美。

[if IE 6]>与<![endif]

yong718100的专栏

10-08

327

------------------------------------------------------------------ < !--[if lte IE 6]> ……< ![endif]--> < !--[if lte IE 6]> ……< ![endif]--> Ite：less than or equal to意思是小于或等于IE6浏览器，用于IE浏览器的条件注释，常用于...

IE浏览器 position:fixed 问题

忽而今夏 qianxiaochi

11-24

4146

这个是我之前的解决办法： http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> http://www.w3.org/1999/xhtml"> 1title> *html{overflow:hidden;} *body{height:100%;overflow:auto;} body {margin:0

IE8 不支持 position:fixed 的简单解决办法

xuanjiewu的专栏

09-28

5916

今天发现使用 position:fixed 的页面在firefox下没有问题，在IE8下却不能正常显示，在网上找了找，有不少相关文章，但是不是不起作用就是太复杂，后来终于发现一个简单的解决办法，就是在html的开头加上：就可以了，后来搜了搜，发现 HTML 4.0 Transitional 和 XHTML 1.0 Transitional 的布局确实有不少差异，可以参见这里：

IE 6~8 position:fixed 不兼容解决方法

eno的博客

07-20

2002

IE8及以下版本对position: fixed 是不支持的所以当你需要页面需要用到固定定位，同时有要兼容IE时可以这样写固定定位先给其他浏览器写定位 .fixed{ position:fixed; /*固定在浏览器左上角*/ top:0; left: 0; width:100px; height:100px; ...