1

我的导航栏上有 6 个链接，并且确实设法在导航栏中附加了一个徽标（这是一个 jpeg），但是我的链接位于徽标的顶部。我将如何将我的链接分开，以便我的徽标独立。

HTML

    <html>
       <head>
       <title>TITLE HERE</title>
       <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1">
       <link rel="stylesheet" href="style.css">
       </head>

        <body>
    <a name="top"></a>
    <table align="center" cellpadding="0" cellspacing="0" border="0" height="100%">
    <tr><new class="right" colspan="2">&nbsp;</td></tr>
    <tr>

<!--Top Navigation Links (top horizontal navigation bar)-->
    <td id="nav1" colspan="2"><a href="index.html">Home</a>
    <a href="LINK1.html" class="nav1">Name</a>
    <a href="LINK2.html">Name</a>
    <a href="LINK3.html" class="nav1">Name</a>
    <a href="LINK4.html">Name</a>
    <a href="LINK5.html" class="nav1">Name</a>
    </tr>
    <tr><td id="head" colspan="2"></td></tr>
    </td>
    </tr>
    <td id="main" valign="right">

和 CSS

td#nav1 {
height: 66px;
background: #000000 url('images/logo.jpg') no-repeat top left;
}
4

2 回答 2

1

td#nav1在等于或大于徽标宽度的左侧添加一些填充。

于 2013-10-03T01:32:20.593 回答
0

将图像添加为 HTML<img>标记，位于nav1主页链接之前。

<img src="images/logo.jpg" alt="This is my sites logo">

移除 CSS 背景属性

background: #000000 url('images/logo.jpg') no-repeat top left;.

将此添加到您的样式表中。

td#nav1 * {
   float: left;
}

然后，您可以在各种元素上使用边距/填充 css 属性来完善您的布局。

于 2013-10-03T01:40:41.537 回答