css一个奇怪的小问题_html/css_WEB-ITnose
- WBOY원래의
- 2016-06-21 08:49:051281검색
我在做一个三列布局，简单要求整体居中，然后左右两列固定宽度，中间一列自适应。
然后我的代码是这个
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>三列布局</title> <style type="text/css"> body{ margin:0; padding:0;} .con{width: 800px;margin: 0 auto;background-color: #ccc;position: relative;color: #000} .left{border:1px solid #333;padding:10px;width: 200px;height: 500px;background-color: transparent;position: absolute;left: 0;top: 0} .center{border:1px solid #333;padding:10px;background-color: transparent;height: 500px;margin: 0 325px 0 225px;} .right{border:1px solid #333;padding:10px;width: 300px;height: 500px;background-color: transparent;position: absolute;right: 0; top: 0;} </style></head><body> <div class="con"> <div class="left"></div> <div class="center"></div> <div class="right"></div> </div></body></html> 现在看起来没有问题。在.lfet .center .right中添加文字都没有什么问题，显示都很正常有自动换行，也没有撑开.center的宽度；但是在它们里面添加“ssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssssss”的时候问题就来了，不会自动换行啊。虽然宽度没有被撑开，但是内容跑出去啦。 这是怎么一回事啊。。十分不解，为什么里面是正常的内容就会自动换行，一串字符串就GG了呢。 网页有智能了吗！！ 啊 细思极恐啊
回复讨论(解决方案)
你放进去的是非正常的字符串，浏览器不知道你会在什么地方换行，所以就不换行了
你放进去的是非正常的字符串，浏览器不知道你会在什么地方换行，所以就不换行了
可以这样理解不，如果我放进去的是“sssssssssssssssssssssssssss”（本意是想放字符letter） 因为没有空格，所以浏览器默认以为是一个单词（word）所以浏览器选择显示完这个word。就跟leeter-spacing和word-spacing感觉一样
是的，换行应在单词分界出
把单词切断的话，应在切断出加连字符
由于各语种的切词规则不尽相同，所以浏览器不能做处理。但专业的排版软件都可以做到
.center{
word-break: break-all;
}
성명：
본 글의 내용은 네티즌들의 자발적인 기여로 작성되었으며, 저작권은 원저작자에게 있습니다. 본 사이트는 이에 상응하는 법적 책임을 지지 않습니다. 표절이나 침해가 의심되는 콘텐츠를 발견한 경우 admin@php.cn으로 문의하세요.