0

以下のコードは私のナビゲーションバーにあるもので、画像が上に表示され、テキストが下に表示されます。とにかくこれを修正できますか? 画像なしでも大丈夫です

<div class="navbar">    
  <ul>
    <li><a class="select" href="/index.html">Home</a></li>
    <li><a href="/products.html">Products</a></li>
    <li><a href="/service.html">Service</a></li>
    <img src="images/logo.png">
    <li><a href="/sales.html">Sales</a></li>
    <li><a href="/about.html">About</a></li>
    <li><a href="/documents.html">Documents</a></li>
  </ul> 
</div>

こんな感じです i.imgur.com/XQqX31X.png できればこんな感じにしたいです i.imgur.com/Te7lo4q.png

4

2 に答える 2

0

は の有効な子ではないため、imgを別の中に配置する必要があります。liimgul

または、リストから完全に除外して、「あなたのデザインがどのようなものか不明」の前に配置する必要があるかもしれませんが、ulそのリストから完全に除外する方が理にかなっていると思います。

于 2013-08-07T08:36:47.087 に答える
0

画像をリスト内の別の項目にする場合は、<img>タグを<li>. 別の方法で表示したい場合は、お知らせください。それを実現するお手伝いをいたします。

デモフィドル

更新されたコード:

<div class="navbar">    
  <ul>
    <li><a class="select" href="/index.html">Home</a></li>
    <li><a href="/products.html">Products</a></li>
    <li><a href="/service.html">Service</a></li>
      <li style="list-style:none"><img src="image.png" /></li>
    <li><a href="/sales.html">Sales</a></li>
    <li><a href="/about.html">About</a></li>
    <li><a href="/documents.html">Documents</a></li>
  </ul> 
</div>
于 2013-08-07T08:40:08.917 に答える