インラインフレームを利用する方法です。baseというタグを使って、ボタンを押すと同じ場所に別のページを表示させる方法です。madoという名前を使って識別させています。でも、リンクするページとかはこの方法ではまずいので記述が変えてあります。ソースを見てくださいね。
|
<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="UTF-8">
<meta name="KEYWORDS" content="HTML5">
<title>インラインフレーム</title>
<link rel="stylesheet" href="myiframe.css">
<base target="mado">
</head>
<body STYLE="font-size:1em">
<div><a href="next1.html"><button type="button">Menu1</button></a></div>
<div><a href="next2.html"><button type="button">Menu2</button></a></div>
<div><a href="next3.html" target="_self">< button type="button">Link Page</button></a></div>
<div id="box">
<iframe src="first.html" height="200" width="200" scrolling="auto" name="mado" frameborder="1" border="1"></iframe>
</div>
</body>
</html>
|
myiframe.cssの内容