au by KDDI EZfactory

ヘルプ | サイトマップ

EZfactoryサイト内検索

XHTML HDML マルチメディア・コンテンツ 技術情報 ダウンロード
XHTML
XHTMLについて

コンテンツの制作

XHTML Basicの基本

応用機能の使用


制作


概要 制作 制作例

XHTML Basicを書こう


01
<?xml version="1.0" encoding="Shift_JIS"?>
02
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML Basic 1.0//EN" "http://www.w3.org/TR/xhtml-basic/xhtml-basic10.dtd">
03
<html>
04
<head>
05
<title>XHTML Basicを書こう</title>
06
</head>
07
<body>
08
<p>XHTML Basicに関して</p>
09
<img src="top.png" />
10
<a href="02.html">2ページ目へ</a>
11
</body>
12
</html>

では、実際にXHTML Basicファイルを書いていきましょう。実際作っていくにあたっては、次のものが必要になります。

パソコン

このページをご覧になっているパソコンで大丈夫です。WindowsでもMacintoshでも構いません。

テキストエディタ

純粋にテキストを編集できるものであれば、Windowsに最初から入っている「メモ帳」でも構いません。インターネット上には、より便利なエディタをダウンロードできるサイトがありますので、より使いやすいものを探してみるのも良いでしょう。
Macintoshを使用する場合は、「文字コード」を変換して保存できるテキストエディタを用意してください。

上記で使ったサンプルのソースコードを解説していきます。

01
<?xml version="1.0" encoding="Shift_JIS"?>

HTML文書には上記にあてはまる宣言はありませんが、XHTML文章はXMLで定義された文章型に従うのでXML宣言を行う必要があります。
encoding宣言 (encoding="Shift_JIS") は文字セットを指定するものです。

02
< "http://www.w3.org/TR/xhtml-basic/xhtml-basic10.dtd">

DOCTYPE宣言はXHTML文章をどの文章型定義に従って作成するかをを指定します。

03
<html>

ファイルの内容がHTMLファイルであると定義するタグです。DOCTYPE宣言の一行後に<html>〜最後尾に</html>をおいて「headタグ」と「bodyタグ」をはさみます。

04
<head>

ドキュメントのタイトルや制作者などヘッダと呼ばれるドキュメントに関する情報を表すものです。

05
<title>XHTML Basicを書こう</title>

<heda>〜</head>の間に記述するヘッダ情報の一つで、ドキュメントに名前をつけるタグです。

06
</head>

ヘッダ (<head>) の終わりを宣言しています。

07
<body>

このタグにはさまれた部分がブラウザ上に表示されます。

08
<p>XHTML Basicに関して</p>

<p>と</p>で囲まれた部分は、一つの段落になり前後が一行空きになります。

09
<img src="top.png" />

imgタグは画像を表示させるタグです。src属性にて読込む画像のアドレスを表記します。
XHTMLでは基本的にタグは省略することは出来ませんので<img>も/で閉じる必要があります。
<img localsrc="シンボル名かアイコン番号" />にて任意のアイコンを表示させることも可能です。

10
<a href="02.html">2ページ目へ</a>

文字やイメージをクリックすることで別のページやサイトへとぶことが出来ます。
その他にもtitle属性を使えばソフトキーを指定でき、accesskey属性を使えばショートカットキーとして割り当てることが可能となります。

11
</body>

ボディ (<body>) の終わりを宣言しています。

12
</html>

htmlファイルの終了を宣言しています。

概要 制作 制作例

このページの先頭へ



KDDI: ユビキタス・ソリューション・カンパニー
au 電話・インターネット 法人サービス 会社情報
Designing The Future ここから当ウェブサイトの情報についてのメニューです。
免責事項 リンクについて 推奨環境 プライバシーポリシー Copyright © KDDI CORPORATION. All Rights Reserved.