html – 标签增加了自己的空白?

前端之家收集整理的这篇文章主要介绍了html – 标签增加了自己的空白?前端之家小编觉得挺不错的,现在分享给大家,也给大家做个参考。
我有以下HTML:
  1. <h2>Embed Code</h2>
  2. <pre>
  3. <code>
  4. &lt;script type=&quot;text/javascript&quot;&gt;
  5. var something = 'else';
  6. &lt;/script&gt;
  7. </code>
  8. </pre>

和以下CSS:

  1. h2 {
  2. background:#1e7ca2;
  3. font-weight: 100;
  4. font-size: 1.25em;
  5. padding: 10px 15px;
  6. margin: 0;
  7. color: white;
  8. }
  9. pre {
  10. margin:0;
  11. padding:0;
  12. }
  13. code {
  14. margin: 0;
  15. padding: 0 30px;
  16. display: block;
  17. background: #1d1f20;
  18. color: #839496;
  19. font-size: .85em;
  20. line-height: 1.6em;
  21. }

但是,h2和pre元素之间有一个差距,我似乎无法摆脱.

你可以在这里看到这个问题:http://jsfiddle.net/gaby/k5V8U/

解决方法

什么是< pre>保留空白.

如果删除< pre>之前的空格和<代码>喜欢这个

  1. <pre><code>

  1. </code></pre>

它得到修复..

演示在http://jsfiddle.net/gaby/k5V8U/1/

猜你在找的HTML相关文章