码迷,mamicode.com
首页 > Web开发 > 详细

css疑难汇总

时间:2015-12-31 07:16:29      阅读:142      评论:0      收藏:0      [点我收藏+]

标签:

关于a标签不换行顶开容器的问题(转自):

我们用div,p,ul,li(等块级元素)布局给其设定了特定的width,那么就会自动的换行。span,a(等内联元素)设置了display:inline-block,或者display:block;也可以自动换行了。(但是含英文的时候这种方法就无效了,还是会超出来)

我们一般控制换行所用到的CSS属性一共三个:word-wrap;word-break;white-space;

word-wrap语法:各浏览器均能识别   word-wrap:normal(默认)|break-word;

网上的结论

word-wrap:normal(默认)|break-word;

参数:

  normal:允许内容顶开指定的容器边界。

  break-word:内容将在边界内换行,必要时触发word-break(注意请分辨清楚word-break和break-word两个是不同的东西,一个为属性,一个为参数);

说明:

  word-wrap是控制是否”为词断行”的,设置或检索当前行超过指定容器时是否断开转行。中文没有任何问题,语句也没有问题,但是对于长串的英文,就不起作用。

范例:

congratulation这个单词属于长串英文,word-wrap:break-word整个单词看成一个整体,如果该行末端宽度不够显示整个单词,它会自动把整个单词放到下一行,而不会把单词截断,这就是对于长串文字不起作用的解释。word-wrap:normal是默认情况,英文单词不被拆开。

 

css疑难汇总

标签:

原文地址:http://www.cnblogs.com/xiii/p/5090546.html

(0)
(0)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!