div骨格にコンテンツを挿入する

divで作った骨格の中に、各コンテンツを挿入します。

サンプルで使う画像はコチラ→画像ダウンロード

01<?xml version="1.0" encoding="utf-8" standalone="no"?>
02<!DOCTYPE HTML PUBLIC "-//W3C//DTD XHTML1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
03<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
04<head>
05<title>ホームページ作成講座</title>
06<meta name="description" content="ホームページ作成の方法を初心者さんにもわかるように、簡単に解説している講座です。" />
07<meta name="keywords" content="ホームページ,作成,講座" />
08<meta name="author" content="wakabagari" />
09<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
10<link rel="stylesheet" type="text/css" href="style/style.css" media="all" />
11</head>
12<body>
13<span><div id="a123">
14<div id="a1"></span>
15<h1><a href="index.html"><img src="gif/4.gif" alt="ホームページ作成講座" /></a></h1>
16<p>>> <a href="#">ホームページ作成講座TOP</a></p>
17<span></div>
18<div id="a2"></span>
19<p><img src="gif/5.gif" alt="画像" /></p>
20<p><img src="gif/22.gif" alt="画像" /></p>
21<ul>
22<li><a href="#">Lesson1</a></li>
23<li><a href="#">Lesson2</a></li>
24<li><a href="#">Lesson3</a></li>
25<li><a href="#">Lesson4</a></li>
26<li><a href="#">Lesson5</a></li>
27<li><a href="#">Lesson6</a></li>
28</ul><span>
29</div>
30<div id="a3"></span>
31<address>Copyright 2007@nkdesk. all right reserved.</address>
32<span></div>
33</div></span>
34</body>
35</html>

全て使用したことのあるタグですので、問題ないですね。

ここまでの作成経過はコチラ→サンプル(ホームページ作成講座)

Lesson7~positionを使ったレイアウト~

コメントor補足情報orご指摘あればをお願いします。

(件名or本文内でキーワード検索できます)



  • << 前のページ
  • 次のページ >>