Space BUG_CSS/HTML

In diesem Artikel geht es um die Verwendung von display:inline;. Als ich vor ein paar Tagen ein Layout erstellte, kam es nie dazu, dass ich zwei Stunden verschwendete und drei Zeilen Code hinzufügte, um es zu lösen. Plötzlich, wenn ich darüber nachdenke, habe ich immer das Gefühl, dass etwas nicht stimmt, weil meine Idee richtig ist, aber ich schreibe den Code einfach nicht um und finde schließlich wieder das Problem, es ist dieser verdammte Space-Bug
unten Zeigen Sie es allen, damit Ihnen das gleiche Problem nicht noch einmal passiert

Werfen wir zunächst einen Blick auf den folgenden CSS-Code:

Code kopieren Der Code lautet wie folgt:

Hinterlassen Sie mir eine Nachricht

Freundliche Links

[Strg+A Alles auswählen Hinweis:

Wenn Sie externe Js einführen müssen, müssen Sie zum Ausführen eine Aktualisierung durchführen ] Hast du es gesehen? Was ist der Unterschied zwischen IE und FIREFOX?
Schauen Sie sich den Layout-Code unten an, ich habe alles in die gleiche Zeile eingefügt: Kopieren Sie den Code

Der Code ist wie folgt folgt:

• Homepage der Website
• Emotionaler Artikel
< li> Hinterlassen Sie mir eine Nachricht
• Freundlicher Link

letztes Es funktioniert!

Homepage

Emotionale ArtikelHinterlasse mir eine Nachricht<meta http-equiv="Content-Type" content="text/html; charset=utf-8">Freundliche Links<style> body{ margin:0; padding:0; font-size:12px; text-align:center;line-height:25px;} #info{ margin:100px auto; background:#CCCC00; } ul,li{ margin:0; padding:0; list-style:none;} #info li{ border-left:1px solid #6633CC; display:inline;border-right:1px solid #6633CC; padding:5px 10px; margin-left:-1px;} </style>
[Strg+A Alles auswählen Hinweis: Wenn Sie externe Js einführen müssen, müssen Sie zum Ausführen eine Aktualisierung durchführen ]

Eine Lösung für das Problem:

<style type="text/css"> <!-- /* pr1984.com */ * {font-size:0;margin:0;padding:0;} body {font-family:"Verdana","宋体", "Arial",sans-serif;margin:100px 0;text-align:center;} a {font-size:12px;color:#000;text-decoration:none;} a:hover {color:#000;text-decoration:none;background-color:#FEFC6E;} #nav {min-width:400px;height:24px;border:1px solid #D28A05;border-width:1px 0;text-align:center;background:#ff9900 url("http://www.zishu.cn/attachments/month_0609/j2006912180.jpg");} #nav li {display:inline;padding:15px 15px 8px;border:1px solid #C97802;border-width:0 1px;margin-right:-1px;line-height:25px;} p {min-width:400px;margin:50px 0;font-size:12px;} --> </style> <!--[if lte IE 6]> <style type="text/css"> #nav ul,p {width:400px;} </style> <![endif]--> <div id="nav"> <ul> <li><a href="http://www.kijiji.cn">Startseite</a></li> <li><a href="http://www.kijiji.cn/fabu">Informationen veröffentlichen</a></li> <li><a href="http://www.kijiji.cn/wo/xxgl" title="在这里可以管理已经发布的信息和个人资料">Meine Gäste kommen zusammen</a></li> <li><a href="http://blog.kijiji.com.cn/help/">Hilfe</a></li> </ul> </div>
[Strg+A alle auswählen Hinweis: Wenn Sie externe Js einführen müssen, müssen Sie zum Ausführen eine Aktualisierung durchführen ]