两个常见的CSS问题-站长杂谈下载

两个常见的CSS问题

来自版块: 站长杂谈发表于: 2015-8-17 10:15:38
29866
0
如本资源下载地址失效,请点击此处进行反馈
开通本站Svip会员,全站资源免费下
  因为引起这两个问题的情况不是很常见,所以很容易被模板制作者所忽略。我一般是在本地测试环境中建有一个测试日志,专门测试此类问题。
  第一个问题更常见,就是纯英文和长英文 (如超长的网址、代码等) 的转行问题。一种是在日志中的正文,一种是在<pre>和<code>中的代码。经过我反复的调试,最后找到了一个样式组合,在常见的浏览器上都没有问题。我的CSS样式如下
  1. body, div, p, pre, code {
    ! ?* s% V+ Q5 p, K! Z4 A/ w+ M
  2. word-wrap:break-word;4 w5 w0 v$ Q. F" `2 E
  3. }
    2 s) q( [+ ~+ S2 d* t( P
  4. pre, code {* f; R2 t2 J: m* `
  5. white-space:pre-wrap;* S* b. w$ b3 p
  6. }
复制代码
  第二个问题就是当日志中设置成文字环绕图片的格式,并且图片后面的文字恰恰很少,就很容易引起错位。这种情况很少见,几乎可以忽略,不过能够预防一下,总不是坏事吧。解决方法也很简单,就是像对付 float 的对像那样,在日志的内容显示代码
  1. <?php echo $log_content; ?>
复制代码
  后面加上一句:
  1. <div class="clear"></div>
复制代码
  这是“.clear”的CSS代码:
  1. .clear {clear:both; height:1px; overflow:hidden;}
复制代码
  常见的写法是“<br style="clear:both;" />”,不过有时候它的间距显得太大,所以我单独写了一个CSS样式,以便反复引用。

, I3 |# F- k' c8 [
  最后附上我的本地测试帖效果:
" q2 c- v+ ~0 d! s% E' F

' `% Z& U* f9 N

全部评论 0

您需要登录后才可以回帖 立即登录
登录
0
0
0
返回顶部