一段防止特长字符串强制溢出的CSS

首页电脑网络一段防止特长字符串强制溢出的CSS(2012年12月22日)

我这个BLOG打从娘胎里就有个问题困扰着我,就是在代码、引用等区域插入特长的字符串,会跑到正文显示区域外面去,这样很不美观啊。

起初发现是在插入代码的时候发现的,以为是那个代码显示的东东的设置问题,不了了之,反正我用到的时候也有限。

最近在插入迅雷地址一长串的时候,也会有这个问题,苦恼啊。

昨天世界末日看大前端D-Simple主题更新到1.2版的日志,说修正了<pre>溢出问题,刚在写上一篇文章的时候插入代码时突然发现也是<pre>标签,试着找了一下,嘿嘿,原来是CSS的reset问题。于是找来一段css代码,加入了reset.CSS文件中:

blockquote, 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  */
}

这样,在blockquote, pre标签中的超长字符串就不会超出正文设置的宽度了,会自动换行了。不错吧

效果看文章《一路向西》下载文章的超长地址blockquote的效果,没有超出来哦,自己换行了。

很实用的CSS技巧,不错。

添加新评论 »

You must enable javascript to see captcha here!