html网页如何将文字排版,【html】文字排版

Web开发过程中文字排版，默认的情况下，行末的长单词会撑开容器。

我们想要的是(像word一样、能够自动换行、既不撑大容器、也不强制拆开行末单词、并且不会隐藏行末单词的多余字母)

①不能撑开容器

②完整的单词不能被强制拆开

③如果行末是长单词的话，整个单词都被换行到下一行

中文排版

标点符号：规定不能至于行首

处理：chrome、IE8、FF浏览器默认标点符号不会置于行首

有些ui会要求 不能至于行尾

技巧：文本内容基本确定的话可以设置letter-spacing的间距来讲行尾的符号调整走

英文排版

关于英文断句

以单词做依据换行：   设置word-wrap:break-word;

总结：

.p1{ word-break:break-all; width:150px;}/*只对英文起作用，以字母作为换行依据*/

.p2{ word-wrap:break-word; width:150px;}/*--只对英文起作用，以单词作为换行依据*/

.p3{white-space:pre-wrap; width:150px;}/*只对中文起作用，强制换行*/

.p4{white-space:nowrap; width:10px;}/*都起作用，强制不换行*/

.p5{white-space:nowrap; overflow:hidden; text-overflow:ellipsis; width:100px;}／/*white-space:nowrap;强制不换行，overflow:hidden; text-overflow:ellipsis;超出部分隐藏且以省略号形式出现*/