logo
电话:13843226952
 
工作时间:周一至周六:8:30-5:00  周日可联系客服QQ
   
  建站咨询㈠ 建站咨询㈡ 售后服务 售前咨询  
关于阳光,吉林市网站建设,吉林市网站制作,网络公司
 当前位置:本站首页 >>> 技术中心

css样式表中是如果做到强行换行的

日期:2010/8/16    来自:吉林市阳光网络科技有限公司   作者:Admin   去百度查找  去Google查找

网页开发中经常会碰到很多怪现象,下面我们看看于css教程之强制换行代码哦,这里也是很多ie兼容问题,导致全是字母时不换行了,我们就用一些方法强制换行吧。

<div id="wrap">正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义</div>
css

#wrap{white-space:normal; width:200px; }

1.(ie浏览器)连续的英文字符和阿拉伯数字,使用word-wrap : break-word ;或者word-break:break-all;实现强制断行

#wrap{word-break:break-all; width:200px;}
或者
#wrap{word-wrap:break-word; width:200px;}

<div id="wrap">abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111</div>

效果:可以实现换行

2.(firefox浏览器)连续的英文字符和阿拉伯数字的断行,firefox的所有版本的没有解决这个问题,我们只有让超出边界的字符隐藏或者,给容器添加滚动条


#wrap{word-break:break-all; width:200px; overflow:auto;}

<div id="wrap">abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111</div>

效果:容器正常,内容隐藏对于table

1. (ie浏览器)使用 table-layout:fixed;强制table的宽度,多余内容隐藏

<table style="table-layout:fixed" width="200">
<tr>
<td>abcdefghigklmnopqrstuvwxyz1234567890ssssssssssssss
</td>
</tr>
</table>

效果:隐藏多余内容

2.(ie浏览器)使用 table-layout:fixed;强制table的宽度,内层td,th采用word-break : break-all;或者word-wrap : break-word ;换行

<table width="200" style="table-layout:fixed;">
<tr>
<td width="25%" style="word-break : break-all; ">abcdefghigklmnopqrstuvwxyz 1234567890
</td>
<td style="word-wrap : break-word ;">abcdefghigklmnopqrstuvwxyz 1234567890
</td>
</tr>
</table>

效果:可以换行

3. (ie浏览器)在td,th中嵌套div,p等采用上面提到的div,p的换行方法

4.(firefox浏览器)使用 table-layout:fixed;强制table的宽度,内层td,th采用word-break : break-all;或者word-wrap : break-word ;换行,使用overflow:hidden;隐藏超出内容,这里overflow:auto;无法起作用

 

<table style="table-layout:fixed" width="200">
<tr>
<td width="25%" style="word-break : break-all; overflow:hidden; ">abcdefghigklmnopqrstuvwxyz1234567890</td>
<td width="75%" style="word-wrap : break-word; overflow:hidden; ">abcdefghigklmnopqrstuvwxyz1234567890</td>
</tr>
</table>

效果:隐藏多于内容

5.(firefox浏览器) 在td,th中嵌套div,p等采用上面提到的对付firefox的方法
运行代码框

 
上一篇:浅谈首页快照不更新的解决方案
下一篇:IIS解释
  阳光新闻 更多>>>
吉林网站建设_吉林网页制作-阳光新闻
移动建站的优势在哪?
如何规划网站的主题
网站优化注意事项
网站建设的趋势
网站建设对企业发展有哪些助力
小程序未来的市场前景
  招贤纳士 更多>>>
诚聘销售精英合作伙伴
诚招吉林市网站建设商务经理
招聘吉林市网站建设技术员
公司招收吉林市网站开发学员
因业务发展需要特诚聘商务代表
  网站建设专题 更多>>>
阳光科技为您提供网站改版服务
为什么网页设计要简练?
如何在百度提交收录,怎样让自己的网站排名
什么样的网站最受访客喜欢?
吉林市网站建设形式与内容应统一
网站管理与团队经营的秘诀
优质的单页网站如何创建
 
Copyright © 2008-2019 www.jlsyg.com, All Rights Reserved    
电话:13843226952  联系人:王经理
ICP备案号:吉ICP备10003760号   技术支持:吉林网站建设
打造好的吉林网络公司!我们为您提供有品质的吉林网站建设吉林市网站建设吉林网站制作吉林网页制作吉林网站优化吉林seo服务!