用css包裹长的URL和文字内容

pre {


    white-space: pre;           / CSS 2.0 /


    white-space: pre-wrap;      / CSS 2.1 /

 white-space: pre-line;      / CSS 3.0 /


    white-space: -pre-wrap;     / Opera 4-6 /


    white-space: -o-pre-wrap;   / Opera 7 /


    white-space: -moz-pre-wrap; / Mozilla /


    white-space: -hp-pre-wrap;  / HP Printers /
        

word-wrap: break-word;      / IE 5+ /
        

}
white-space - 空格内元素的显示方式
                                                
                                                        

• 取值: normal | pre | nowrap | pre-wrap | pre-line | inherit
  • normal: 正常无变化(默认处理方式.文本自动处理换行.假如抵达容器边界内容会转到下一行)
  • pre: 保持HTML源代码的空格与换行,等同于pre标签
  • nowrap: 强制文本在一行,除非遇到br换行标签
    
  • pre-wrap: 同pre属性,但是遇到超出容器范围的时候会自动换行
  • pre-line: 同pre属性,但是遇到连续空格会被看作一个空格
  • inherit: 继承

平时的时候，简单化只要用 pre-line就可以了~

这有个实例，可以看下
http://perishablepress.com/press/wp-content/online/demos/css-wrap-demo.html

转载于:https://www.cnblogs.com/jackwalk/archive/2011/07/24/2115440.html