css自动换行,防止撑破div
动换行问题,正常字符的换行是比较合理的,而连续的数字和英文字符常常将容器撑大,挺让人头疼,下面介绍的是CSS如何实现换行的方法
对于div,p等块级元素
正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal,当定义的宽度之后自动换行
html
<
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;}
<
id="wrap">abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111< /div
>
效果：可以实现换行
2.（Firefox浏览器）连续的英文字符和阿拉伯数字的断行,Firefox的所有版本的没有解决这个问题,我们只有让超出边界的字符隐藏或者,给容器添加滚动条
#wrap{word-break:break-all; width:200px; overflow:auto;}
<
id="wrap">abcdefghijklmnabcdefghijklmnabcdefghijklmn111111111< /div
>
效果：容器正常，内容隐藏
对于table
1.
(IE浏览器)使用 table-layout:fixed;强制table的宽度,多余内容隐藏
< style="table-layout:fixed" width="200">
<>
<>abcdefghigklmnopqrstuvwxyz1234567890ssssssssssssss
<
/td >
<
/tr >
<
/table >
效果：隐藏多余内容
2.(IE浏览器)使用
table-layout:fixed;强制table的宽度,内层td,th采用word-break : break-all;或者word-wrap :
break-word ;换行
< width="200" style="table-layout:fixed;">
<>
<
width="25%" style="word-break : break-all; ">abcdefghigklmnopqrstuvwxyz
1234567890
<
/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;
相关文档：
由于各浏览器的默认CSS样式不一样，我们必须写一个CSS Reset统一起来。
通常我的做法是在common.css里写全局控制，这里面也包括header和footer，其它CSS文件就通过@import url(”common.css”);引用。
body{padding:10px;margin:0;background:#fff;font-size:12px;line-height:14px;color:#333;font-family:Ari ......
原文地址：http://www.devwebpro.com/25-rounded-corners-techniques-with-css/
* This post is regularly updated. *
Rounded corners is one of the most popular and frequently requested
CSS techniques even the father of internet Google
also launch the rounded corners style markup
with her Google Ad ......
CSS是一个非常强大的网站设计标记语言。
虽然你可能会认为，任何人都可以转去写CSS代码，但是为了确保您在正确的轨道上，这里有如下8项
CSS原则，每个网页设计师应该遵循。
1、W3C验证
如果你是1个正在写CSS编码的人员，那么建议您每次对您所创建的CSS代码进行验证。但是，有很多设
计� ......
我们从52CSS.com中学习DivCSS网页布局的知识，可是W3C validation有时难以操作，但用它你可以查看由版面设计引起的差错。验证程序抛出大量差错和警告，说明你的XHTML尚未完善，可能无法在不同浏览器上保持一致功能。下面十个细微的失效问题难住了大批程序员，本文就告诉你如何解决。在本文开始前介绍一� ......
Internet Explorer 8预设是以CSS 2.1为标准，并修正了许多Internet Explorer 7的CSS Bug，这意味着有一部份以往依据IE 7所设计的网页，
在IE 8上的呈现会有所出入，所幸拜IE 7相容检视功能所赐，目前因使用IE 8而导致版面错误的网站并不多。
但一值依赖IE 7相容检视功能并非长久之计，尽早将网站修改为IE 8相容才是长久 ......
