删除图像之间的多余空间 [英] Removing unwanted space between images

问题描述

我的问题出在我的导航栏中，可以在这里找到: http://grupocoral.netai.net/

My problem is in my navigation bar, which can be found here: http://grupocoral.netai.net/

这些图像之间有一个空格，我想将其删除.我该怎么办?

JavaScript代码:

Javascript Code:

function swap(element, image) {
  element.src = image;
}

以及html代码:

<div id="navbar"><a href="index.php"><img src="images/homeover.png"></a>
<a href="membros.php"><img src="images/membros.png" onmouseover="swap(this, 'images/membrosover.png');" onmouseout="swap(this, 'images/membros.png');"></a>
<a href="canticos.php"><img src="images/canticos.png" onmouseover="swap(this, 'images/canticosover.png');" onmouseout="swap(this, 'images/canticos.png');"></a>
<a href="celeb.php"><img src="images/celebracoes.png" onmouseover="swap(this, 'images/celebracoesover.png');" onmouseout="swap(this, 'images/celebracoes.png');"></a>
<a href="contactos.php"><img src="images/contactos.png" onmouseover="swap(this, 'images/contactosover.png');" onmouseout="swap(this, 'images/contactos.png');"></a>
</div>

以防万一，导航栏CSS代码:

Just in case, navbar CSS code:

#navbar{
    width: 1280px;
    margin: 0 auto;
    height: 40px;
    horizontal-align: center;
    padding:inherit;
}

顺便问一下，您是否知道在没有JS的情况下制作菜单的其他方法?

谢谢，兰吉尔

推荐答案

这是由于代码中的空白.删除链接之间的空白，然后将其清除.

It's due to the white space in your code. Remove the white space between your links and that should clear it up.

换句话说，将您的HTML导航块更改为:

In other words, change your HTML block of navigation to:

<div id="navbar"><a href="index.php"><img src="images/homeover.png"></a><a href="membros.php"><img src="images/membros.png" onmouseover="swap(this, 'images/membrosover.png');" onmouseout="swap(this, 'images/membros.png');"></a><a href="canticos.php"><img src="images/canticos.png" onmouseover="swap(this, 'images/canticosover.png');" onmouseout="swap(this, 'images/canticos.png');"></a><a href="celeb.php"><img src="images/celebracoes.png" onmouseover="swap(this, 'images/celebracoesover.png');" onmouseout="swap(this, 'images/celebracoes.png');"></a><a href="contactos.php"><img src="images/contactos.png" onmouseover="swap(this, 'images/contactosover.png');" onmouseout="swap(this, 'images/contactos.png');"></a>    </div>

这篇关于删除图像之间的多余空间的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！