メニューアイコンの画像を並べる

[統計] HTMLからXHTMLへの移行を進めていますか?



0   名前: まい : 2006/02/13 12:40
メニューをこのように
http://color.2.pro.tok2.com/item1101/0312/button.html
縦につなげて表示したいのですが、画像の上下に空白ができてしまいます。
どうすればつなげて表示することが出来るのでしょうか。

<HTML>
<HEAD>
<TITLE>menu</TITLE>

<SCRIPT TYPE="text/javascript">
<!--

if (document.images) {


// 設定開始(使用する画像を設定してください)

// 画像1
var img1on = new Image();
img1on.src = "about1.gif"; // ポイント時の画像
var img1off = new Image();
img1off.src = "about.gif"; // 通常の画像

// 画像2
var img2on = new Image();
img2on.src = "me1.gif";
var img2off = new Image();
img2off.src = "me.gif";


// 設定終了


}

// ポイント時の処理
function On(name) {

if (document.images) {
document.images[name].src = eval(name + 'on.src');
}

}

// 放した時の処理
function Off(name) {

if (document.images) {
document.images[name].src = eval(name + 'off.src');
}

}

// -->
</SCRIPT>

</HEAD>
<BODY TOPMARGIN="0" LEFTMARGIN="0" MARGINHEIGHT="0" MARGINWIDTH="0">

<img src="menutop.gif" width="67" height="9">
<br>
<A HREF="about.html" onMouseOver="On('img1')" onMouseOut="Off('img1')"><IMG SRC="about.gif" ALT="About" BORDER="0" WIDTH="67" HEIGHT="15" NAME="img1"></A>
<br>
<A HREF="me.html" onMouseOver="On('img2')" onMouseOut="Off('img2')"><IMG SRC="me.gif" ALT="me" BORDER="0" WIDTH="67" HEIGHT="15" NAME="img2"></A>
<br>


</BODY>
</HTML>

1   名前: まい : 2006/02/13 12:40
すみません、URLを間違えていました。以下の様なもので宜しくお願いします。
http://color.2.pro.tok2.com/item1101/button/menu/menu20/menu20.html

2   名前: カヅサツ : 2006/02/13 12:40
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN"
"http://www.w3.org/TR/html4/strict.dtd">
<html lang="ja" dir="ltr">
<head>
<title>menu</title>
<style type="text/css">
h1{
margin-bottom: 0px;
font-size: xx-small;
}
ul{
margin: 0px;
padding: 0px;
list-style-type: none;
line-height: 1;
}
li{
height: 15px;
font-size: xx-small;
}
h1 img,
li img{
vertical-align: bottom;
}
a:link img,
a:visited img{
border-width: 0px;
}
</style>
<script type="text/javascript">
function ImgChange(ObjId,ObjSrc){
var obj = document.getElementById(ObjId);
obj.src = ObjSrc;
}
</script>
</head>
<body>
<h1><img src="menutop.gif" width="67" height="9" alt="menu"></h1>
<ul>
<li><a href="about.html"
onmouseover="ImgChange('img1','about1.gif')"
onmouseout="ImgChange('img1','about.gif')"><img
src="about.gif" alt="About" width="67" height="15"
id="img1"></a></li>
<li><a href="me.html"
onmouseover="ImgChange('img2','me1.gif')"
onmouseout="ImgChange('img2','me.gif')"><img
src="me.gif" alt="me" width="67" height="15"
id="img2"></a></li>
</ul>
</body>
</html>

一覧へ戻る