css实现自动换行介绍及对firefox自动换行探讨
Admin 2021-04-15 群英技术资�
在div CSS布局中,如果是遇到连续的字母或者数字在div、p、h2等盒子里排成一排显示,那么是不会随着盒子的宽带而自动换行的,因此我们需要css样式来实现自动换行。我们知道不同浏览器对于CSS样式的兼容性是不同的,这篇文章就探讨一下在Firefox浏览器如何实现自动换行�
IE直接�:
word-break:break-all; /*允许词内换行*/
word-wrap:break-word; /*内容将在边界内换�*/
/*需要注意的默认是:*/
word-wrap:normal /*允许内容顶开指定的窗口边�*/
而firefox却没有很好的实现办法 ,一个折中就是使用滚动条,但网上也提出了一种用js来判断换行的办法,这里摘录下(转自网络,特此说�)�
JavaScript
<script type="text/javascript">
function toBreakWord(intLen, id){
var obj=document.getElementById(id);
var strContent=obj.innerHTML;
var strTemp="";
while(strContent.length>intLen){
strTemp+=strContent.substr(0,intLen)+"<br>";
strContent=strContent.substr(intLen,strContent.length);
}
strTemp+= strContent;
obj.innerHTML=strTemp;
}
</script>
注:以上脚本放在</head>前面.
同个页面单处调用�
<div id="content">这里是要应用换行的内�</div><script type="javascript">toBreakWord(60, "content");</script>
同个页面多处调用�
<div id="content">这里是要应用换行的内�</div><script type="javascript">toBreakWord(60,"content");</script>
<div id="content2">这里是要应用换行的内�</div><script type="javascript">toBreakWord(60,"content2");</script>
注:把应用的JS写在</div>后面,其�60表示一行要显示多少字字符,注意多个调用时ID的相应变化,不能同一个ID名称,应用上面的方法后IE也会是按设定的字符数换行,但是IE里面支持自动换行,所以只要判断一下是否为IE,如果不是IE就不要输出上面的 XML/HTML
<script language="javascript">toBreakWord(60, "content");</script>
这段JS,如果不是就要输出。代码未经测试,偶只看了思路,有需要的自己去调试吧�
以上就是关于css自动换行的介绍,当然还是很多Firefox实现自动换行的方法,感谢的朋友能直接研究一下,希望上述内容对大家有帮助�
免责声明:本站发布的内容(图片、视频和文字)以原创、转载和分享为主,文章观点不代表本网站立场,如果涉及侵权请联系站长邮箱:[email protected]进行举报,并提供相关证据,查实之后,将立刻删除涉嫌侵权内容�
猜你喜欢
这篇文章主要介绍了浅谈移动端中的视口(viewport)的具体使用,文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友们下面随着小编来一起学习学习吧
三栏布局在实际的开发十分常见,比如淘宝网的首页,即左边商品导航和右边导航固定宽度,中间的主要内容随浏览器宽度自适应,具有一定的参考价值,感兴趣的小伙伴们可以参考一�
这篇文章主要介绍了CSS绘制三角形的实现代码(border�)的相关资料,小编觉得挺不错的,现在分享给大家,也给大家做个参考。一起跟随小编过来看看吧
css怎么实现图像映射?我们在做网站设计的时候,有时会需利用图像映射来实现一些效果,这篇文章就给大家介绍一下CSS实现图像映射的方法,感兴趣的朋友就继续往下看吧�
这篇文章给大家分享的是css伪类的分类及作用,小编觉得挺实用的,因此分享给大家做个参考。另外,下文还介绍了伪元素的分类及作用,以及CSS 伪类修改input选中样式的示例代码,感兴趣的朋友也可以了解看看�
推荐内容
联系我们
24小时售后 � 24小时售后TEL�0668-2555666 售前咨询TEL�400-678-4567 投诉建议TEL�0668-2555999 投诉建议邮箱:t[email protected] 信息安全TEL�0668-2555118 域名空间客服 � 公司总机�0668-2555555 公司传真�0668-2555000Copyright © QY Network Company Ltd. All Rights Reserved. 2003-2020 群英 版权所� 茂名市群英网络有限公�
增值电信经营许可证 : B1.B2-20140078