1

私の問題は、ボックス間にギャップを与えたくないということです。

このギャップを取り除く方法を提案してください:)

私のCSS

.menu:link,.menu:visited
{
font-weight:bold;
color:#FFFFFF;
background-color:#98bf21;
width:80px;
text-align:center;
padding:4px;
text-decoration:none;
}
.menu:hover,.menu:active
{
background-color:#7A991A;
}

マイメニュー PHP

<?php
echo '<a class="menu" href="/test/index.php">Home</a>
<a class="menu" href="/test/profile.php">Profile</a>
<a class="menu" href="/test/settings.php">Settings</a>
<a class="menu" href="/test/image.php">Image</a> 
<a class="menu" href="/test/logout.php">Logout</a>';
?>
4

3 に答える 3

1

これがあなたの問題の簡単な解決策です:

すべてのアンカータグ間にギャップを使用しないでください。隙間なく一列に並べてください。あなたの問題は解決されます。

以下のデモを参照してください

Visit http://jsfiddle.net/creators_guru/6B9ea/
于 2013-03-01T05:16:52.953 に答える
1

リンク タグ間の空白を削除します。

jsFiddle の例

<a class="menu" href="/test/index.php">Home</a><a class="menu" href="/test/profile.php">Profile</a><a class="menu" href="/test/settings.php">Settings</a><a class="menu" href="/test/image.php">Image</a><a class="menu" href="/test/login.php">Logout</a>

また

<a class="menu" href="/test/index.php">Home</a><!--
--><a class="menu" href="/test/profile.php">Profile</a><!--
--><a class="menu" href="/test/settings.php">Settings</a><!--
--><a class="menu" href="/test/image.php">Image</a><!--
--><a class="menu" href="/test/login.php">Logout</a>

または単にそれらを左に浮かせます

.menu {
    float:left;
}
于 2013-03-01T04:44:58.500 に答える
1

文字列にスペースがあります。

文字列を作成するには、次のメソッドを参照できます

ここで、$url は href で、$displayText は表示用のテキストです

$menu .= sprintf('<a class="menu" href="%s">%s</a>' , $url , $displayText);

$menu = sprintf('<a class="menu" href="%s">%s</a>', '/test/index.php' , "Home");
$menu .= sprintf('<a class="menu" href="%s">%s</a>', '/test/profile.php' , 'Profile');
$menu .= sprintf('<a class="menu" href="%s">%s</a>', '/test/settings.php' , 'Settings');
$menu .= sprintf('<a class="menu" href="%s">%s</a>', '/test/image.php' , 'Image');
$menu .= sprintf('<a class="menu" href="%s">%s</a>', '/test/login.php' , 'Logout');

echo $menu ;
于 2013-03-01T04:54:55.433 に答える