為什么字母a沒有自動換行，而是頂出右邊了
<!DOCTYPE html>
<html>
<head>
<title></title>
<meta charset="utf-8">
<style type="text/css">
body{margin:0; padding: 0;font-size: 20px;}
div{text-align:center;line-height: 30px; }
.main{width:960px; margin:0 auto;position:relative;}
.left{background-color: red; width:200px;height:500px;position: absolute;left:0; top:0;}
.middle{height:500px;margin: 0 160px 0 200px;border:1px solid green;}
.right{background-color: blue; width:160px; height:500px;position:absolute;right:0; top:0;}
</style>
</head>
<body>
<div class="main">
<div class="left">left</div>
<div class="middle">aaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaaa</div>
<div class="right">right</div>
</div>
</body>
</html>
2016-11-21
這樣一串連續的字符會被創建為一個無名塊框，如果中間沒有空格，默認不會換行，可以改變換行機制，對middle設置word-wrap: break-word; 讓其強制換行，即使沒有空格也換行，一般連續的一串字符是一個單詞(word)，所以是break-word；也可以設置overflow:hidden或者overflow：auto，這樣會自動隱藏溢出的內容或者出現滾動條；
2016-11-21
你試試每個a中間留個空格？
因為你這么寫一段字母，瀏覽器也無法區分應該換行的位置，如果你寫一段文字或者粘貼一段英文文稿，肯定能實現自動換行！