0

わかりました、これは簡単なことです。私は最初にウェブサイトのホームページにリンクする通常の「ホーム」ボタンを作成しましたが、「ホーム」という言葉はあまりにも明白に見えました。そのため、その単語の代わりにアイコンを挿入しようとしましたが、正しくフィットしませんでした。私はcssでいくつかのことを試しましたが、全体が台無しになっています（ナビゲーションメニューの作成に使用されます）。スクリーンショットが添付されています。誰かが何が悪いのかわかるかどうかお願いします。ここに画像の説明を入力してください

CSS：-

 ul#menu
{
padding: 0px;
position: relative;
margin: 0;

}
ul#menu li
{
display: inline;
text-decoration:solid;

}
ul#menu li a 
{
color: black;
background-color: #f5b45a;
padding: 10px 20px;
text-decoration: none;
line-height: 2.8em;
/*CSS3 properties*/
border-radius: 4px 4px 0 0;
}

HTML：-

<ul id="menu">
    <li id="Home_Link"><a href="Home"><img src="../../Image_Data/Home_Icon.ico" id="Home_Icon"/></a></li>
    <li><a href="Men">MEN</a></li>
    <li><a href="Women">WOMEN</a></li>
    <li><a href="Kids">KIDS</a></li>
    <li><a href="Design">DESIGN!!</a></li>
4

1 に答える 1

0

現在のスタイルでは、次のように、画像の垂直方向の配置と余白を試す必要があります。

ul#menu li#Home_Link a img {
  vertical-align: text-bottom;
  margin-bottom: -5px;
}

補足として、要素にIDを使用することはお勧めしません。必要に応じてクラスを使用してください。そして、スタイル宣言の特異性を減らします。例：.home-link img

于 2013-03-24T22:52:06.853 に答える