.word {
// 必须设置宽度
width: 270px;
word-break: break-word;
white-space: pre-line;
} 
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8"/>
<style>
div{
width: 70px;
height: 100px;
background: green;
}
.con1,.con2{
border: 1px solid black;
}
</style>
</head>
<body>
<div class="con1">
This is a loooooooooooooooooooooooooooooooooooooooooong word.
</div>
<div class="con2">
This is a short word.
</div>
</body>
</script>overflow-wrap: normal;
overflow-wrap: anywhere;
overflow-wrap: break-word;<div class="demo">
<p>正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal，当定义的宽度之后就会自动换行</p>
<p>数字和英文字符:</p>
<p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
<p>强制换行后</p>
<p class="wrap">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
</div><div>
<p>正常文字的换行(亚洲文字和非亚洲文字)元素拥有默认的white-space:normal，当定义的宽度之后就会自动换行</p>
<p>数字和英文字符:</p>
<p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
<p>强制换行后</p>
<p>aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</p>
</div>
<div>
<p>This is a long Wordddddddddddddddddddddddddddddddddddddddd!</p>
<p>This is a long Wordddddddddddddddddddddddddddddddddddddddd!</p>
</div>
<div >
<p>
<font >EBOM</font>
<span >编号：</span>
<span id="ParentsCode"></span>
<span >名称：</span><span id="EbomName"></span>
</p>
</div>
一般的元素都有设置自动换行的自动换行：
word-wrap: break-word;
word-break: normal;
强制不换行：
white-space:nowrap;
CSS设置不转行:
overflow:hidden 隐藏
white-space：normal 默认 //***
pre 换行和其他空白字符都将受到保护
nowrap 强制在同一行内显示所有文本，直到文本结束或者遭遇 br 对象
设置强行换行
word-break:
normal ; 依照亚洲语言和非亚洲语言的文本规则，允许在字内换行
break-all : 该行为与亚洲语言的normal相同。也允许非亚洲语言文本行的任意字内断开。该值适合包含一些非亚洲文本的亚洲文本
keep-all : 与所有非亚洲语言的normal相同。对于中文，韩文，日文，不允许字断开。适合包含少量亚洲文本的非亚洲文本与之间的高度解决办法
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>css实现文字较少时居中，文字较多换行时左对齐</title>
<style>
*{
margin: 0;
padding: 0;
}
.main{
width: 300px;
height: 500px;
border: 1px solid #000;
margin: 0 auto;
margin-top: 20px;
}
.wrap{
width: 135px;
height: 200px;
border: 1px solid #f00;
margin-left: 10px;
margin-top: 10px;
float: left;
box-sizing: border-box;
overflow: hidden;
text-align: center;
}
.img{
width: 135px;
height: 140px;
background: rgba(0,0,0,0.4);
}
.wrap p{
font-size: 13px;
display: inline-block;
text-align: left;
word-break: break-all;
padding: 0 5px;
}
</style>
</head>
<body>
<div class="main">
<div class="wrap">
<div class="img"></div>
<p>文字文字</p>
</div>
<div class="wrap">
<div class="img"></div>
<p>文字过多文字过多文字过多文字过多文字过多文字过多</p>
</div>
<div class="wrap">
<div class="img"></div>
<p>文字过多文字过多文字过多文字过多文字过多文字过多</p>
</div>
</div>
</body>
</html>
{
white-space: nowrap;
text-overflow:ellipsis;
overflow:hidden;
} <style type="text/css">
.AutoNewline
{
word-break: break-all;/*必须*/
}
</style> <table>
<tr>参数
word-break:normal(默认)||break-all||keep-all Firefox、Opera不能识别String text = "This is a long text that needs to be split into multiple lines. " +
"Here is the first line." +
"Here is the second line." +
"Here is the third line.";
System.out.println(text);
word-break: break-all;
/*只对英文起作用，以字母作为换行依据。
如果该行末端有个很长的英文单词，它会把单词截断，一部分保持在行尾，另一部分换到下一行。*/
word-wrap: break-word;
/*只对英文起作用，以单词作为换行依据。
如果该行末端宽度不够显示整个单词，它会自动把整个单词放到下一行，而不会把单词截断掉。*/
white-space: pre-wrap;
/*只对中文起作用，强制换行。*/.wrap { table-layout:fixed; word-break: break-all; overflow:hidden; }
这里 overflow:hidden;或者 auto；div{
white-space:nowrap;
}
自动换行
div{
word-wrap: break-word;
word-break: normal;
}
强制英文单词断行
div{
word-break:break-all;
} <div id="alertiframe"> <span id="closeiframe">×</span> <p >提现政策</p> <p >（1）每天最多申请三笔；每笔不低于500元。</p> <p >（2）当天15:30之前提交的提现申请视为当天的有效申请，15:30之后提交的提现申请视为次日的有效申请，如遇非工作日，时间顺延。</p> <p >（3）当天有效的提现申请。结算中心保证当天处理完毕并完毕款项的转出工作，视对方收款银行的入账情况而定。一般1-3个工作日到账。建行的收款账户能够保证当天可到账。</p> <p >（4）提现手续费按提现金额1%-3%。暂不收取。
