在某些wordpress主题下发表文章,如果文章内部带有比较长的链接的话,在PC上可能没啥问题,但是用手机浏览的话这些过长的链接就有可能超出屏幕宽度。原因是,英文的链接(含纯文本链接和超文本链接)不会自动换行。
解决这个问题很简单,在主题的CSS文件中添加如下定义:
a { word-wrap: break-word; }
这是对超文本链接宽度做了定义,让其达到上级容器的宽度限制的时候,自动换行。
在对文章内容部分做如下定义:
.page-content { word-wrap: break-word; }
这就对纯文本连接也做了宽度定义,让其达到上级容器的宽度限制的时候,也自动换行。
最后,用手机浏览器打开网页刷新一下再看看,是不是链接内容超出屏幕的问题已经解决了?