ie不支持max-height的解决之法

最新推荐文章于 2020-08-05 11:29:29 发布
最新推荐文章于 2020-08-05 11:29:29 发布
阅读量5.6k 收藏
点赞数
分类专栏： 一些脚本和样式 文章标签： ie firefox div 2010
版权声明：本文为博主原创文章，遵循 CC 4.0 BY-SA 版权协议，转载请附上原文出处链接和本声明。
本文链接：https://blog.csdn.net/windxxf/article/details/5861442
版权

ie不支持max-height的解决之法

.div{ max-height: 100px; _height:expression(this.scrollHeight > 100 ? "100px" : "auto"); overflow-y:auto; } 这样就可以让div在ie和firefox中都实现max-height的效果

.div{ max-height: 100px; min-height:60px; _height:expression(this.scrollHeight > 100 ? "100px" : ( this.scrollHeight < 60 ? "60px" : "auto")); overflow-y:auto; } 这样就可以让div在ie和firefox中都实现max-height和min-height的效果


摘自：http://zwm1104.blog.163.com/blog/static/1147333220103123839613/

windxxf
关注
  • 0
    点赞
  • 踩
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
专栏目录
利用JS解决ie6不支持max-width,max-height问题的方法
10-26
本篇文章主要介绍了利用JS解决ie6不支持max-width,max-height问题的方法。需要的朋友可以过来参考下，希望对大家有所帮助
IE6支持max-height、min-height CSS样式
Java/Android/IOS/前端/云计算
02-11 587
让IE6支持max-height、让IE6支持min-height样式属性方法教程 我们在写CSS的时候，常常会遇到让一个图片或一个布局不能超出设定一定高度范围值，有时也需要设置一个最小高度值，以达到对齐等样式。接下来由DIVCSS5为大家总结的如何解决IE6不支持max-height和不支持max-height的方法；IE6 max-height、min-height不支持解决方法。 目录
max-height 兼容ie
lixiaohua66的博客
12-09 498
div{ max-height : 100px; _height:expression((document.documentElement.clientHeight||document.body.clientHeight)<100px?"100px":""); overflow:hidden; }
[CSS] max-height 属性
weixin_36210698的博客
03-28 1309
max-height 属性 原文链接：max-height 属性 实例 设置段落的最大高度： p { max-height: 100px; } 在 jsrun 中查看示例 浏览器支持 IE Firefox Chrome Safari Opera 支持 支持 支持 支持 支持 所有主流浏览器都支持 max-height 属性。 注释： 任何版本的 Internet Exp...
关于父元素设置maxHeight或minHeight，子元素高度设置%的不生效的问题
qq_43620719的博客
08-05 9385
关于父元素设置maxHeight或minHeight，子元素高度设置%的不生效的问题 要理解这个问题，首先要搞清楚一个元素的高度是由什么决定的？如果在不额外设置高度或者行高等外加的影响高度的css样式时，一个元素的高度就是其内部元素内容的高度之和。所以元素的高度是由内向外计算的。 那如果 <div class="box"> <div class="item1">第一行内容</div> <div class="item2">第二行内容</div
如何让ie兼容max-height，和min-height属性
kongjiea笔记
09-19 5233
IE6支持最大宽度：.yangshi{max-width:1000px;_width:expression((document.documentElement.clientWidth||document.body.clientWidth)
IE 6不支持min-height或max-width等属性的完美解决方案
12-02
坑人的IE6，不支持min-height，但是实际操作中，这个属性是非常需要的。那IE6下面怎么实现呢？请看geniusalien提供的完美解决方案： （geniusalien温馨提示：本文的min-height操作方式试用于min-width、max-width、...
让IE6支持最小高度min-height、最大高度max-height的方法
09-25
1. **IE6支持`max-height`的解决方法** 在IE6中，我们不能直接使用`max-height`属性，因为它不被识别。一种常见的解决方案是利用IE6特有的下划线前缀`_height`配合`expression`属性来模拟`max-height`的效果。例如...
一行代码轻松搞定各种IE兼容问题,IE6,IE7,IE8,IE9,IE10
热门推荐
小诺
11-26 7万+
在网站开发中不免因为各种兼容问题苦恼，针对兼容问题，其实IE给出了解决方案Google也给出了解决方案百度也应用了这种方案去解决IE的兼容问题？ 百度源代码如下： 1 2 html xmlns=http://www.w3.org/1999/xhtml xmlns:bd=http://www.baidu.com/2010/xbdml> 3 head> 4 m
ie浏览器下的css expression使用
mojianpo 莫建坡
03-06 307
   针对ie浏览器有些情况下显示效果比较差，所以针对ie可以使用expression增加样式（通过javascript的方式）   div[class="dijitTreeContainer"]{  start : expression(function(obj){      if(obj.innHTML.trim() == ""){obj.style.height="1px";} ...
IE min-width 与 max 无效解决方法
封神之路~
03-21 2752
<br />min-width<br /> <br />_width:expression((documentElement.clientWidth < 1008) ? "1008px" : "auto" );<br /> <br /> <br /> <br />max-width<br />_width:expression((documentElement.clientWidth >600) ? “600px” : “auto” );
在IE11中，当min-height遇到了flex
siwangdexie_copy的博客
04-16 2495
在IE11中，当min-height遇到了flex 背景： 解决Flexbox跨浏览器兼容Bug
解决IE11兼容HTML5 设置
sophiayang1997的博客
10-06 3万+
最近做一个Web html5网站，在chrome,firefox,safari,opera，360浏览器（极速模式）、搜狗浏览器等浏览器下均没有问题，而在IE8及IE11下发现样式无法显示，然后各种百度啊，最后在 雅朋网 的一个网友帖子的帮助下解决了问题，现在将解决方法总结如下： 首先需要确保你的HTML页面开始部分要有DOCTYPE声明。DOCTYPE告诉浏览器使用什么样的HTML或X
火狐min-height不兼容解决方法
weixin_34239592的博客
07-27 440
我们在进行页面架构的时候，一般会分成三个section：header、body、footer。如下面这个页面： 这个时候我们就需要对body部分进行最小高度设置，才能避免footer部分出现在页面中间的情况。比方说下面在这个写法： .page-content-header { 　　min-height: 5%;} .page-content-body { 　　min-heig...
ie max-height
ava_chc的专栏
03-01 76
[code="java"]Html代码 .div{ max-height: 100px; _height:expression(this.scrollHeight > 100 ? "100px" : "auto"); overflow-y:auto; } [/code]
兼容各个浏览器的最大高度和最小高度
weixin_34268310的博客
11-25 581
2019独角兽企业重金招聘Python工程师标准>>> ...
ie浏览器 freemarker 文本超过2行显示省略号
最新发布
07-27
如果你在 IE 浏览器中使用 FreeMarker，并且想要实现文本超过两行显示省略号的效果，可以尝试以下方法： 1. 使用 CSS 的 `-ms-line-clamp` 属性： ```html <style> .text-container { display: -webkit-box; /* 兼容其他浏览器 */ display: -ms-flexbox; /* 兼容 IE 浏览器 */ -webkit-line-clamp: 2; /* 控制显示的行数 */ -ms-line-clamp: 2; /* 控制显示的行数，仅在 IE 浏览器中生效 */ -webkit-box-orient: vertical; overflow: hidden; text-overflow: ellipsis; } </style> <div class="text-container"> ${text} <!-- 这里是你要显示的文本内容 --> </div> ``` 在上面的示例中，我们使用了 `-ms-line-clamp` 属性来控制文本容器在 IE 浏览器中显示的行数为 2 行。同时，为了兼容其他浏览器，我们也保留了 `-webkit-line-clamp` 属性。 2. 使用 JavaScript 进行兼容性处理： 如果以上方法在 IE 浏览器中仍然不起作用，你可以尝试使用 JavaScript 来进行兼容性处理。以下是一个示例代码： ```html <style> .text-container { max-height: 3.6em; /* 控制显示的行数，这里设置 3.6em 是因为每行大约是 1.2em 的高度 */ overflow: hidden; text-overflow: ellipsis; } </style> <div class="text-container" id="textContainer"> ${text} <!-- 这里是你要显示的文本内容 --> </div> <script> var textContainer = document.getElementById('textContainer'); if (textContainer.offsetHeight < textContainer.scrollHeight) { textContainer.style.maxHeight = '2.4em'; /* 如果内容超过 2 行，则设置最大高度为 2 行 */ } </script> ``` 在这个示例中，我们首先通过 CSS 设置了容器的样式，然后使用 JavaScript 动态判断内容是否超过了两行。如果超过了两行，我们通过修改容器的最大高度来实现省略号效果。 请注意，在使用 JavaScript 进行兼容性处理时，确保在文档加载完毕后执行 JavaScript 代码，以避免出现找不到元素的问题。 希望以上方法能够帮助你在 IE 浏览器中实现文本超过两行显示省略号的效果。如果问题仍然存在，请提供更多的代码和上下文信息，以便我能够更好地帮助你解决问题。
评论
添加红包

请填写红包祝福语或标题

个

红包个数最小为10个

元

红包金额最低5元

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

抵扣说明：

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

余额充值