このページの短縮URL(リンク用) §02-02…段落の操作<p>タグ – オンライン無料パソコン講座 | PCセミナー

§02-02…段落の操作<p>タグ

(01) 「はじめまして」という文章が入力されたWebページを作成します。新規テキストファイルを作成してください。次に基本内容(「temp01.htm」に入力した文章)をコピーしたあと、「本文入力個所」を「はじめまして」に変更してください。このように、ページに表示させたい文章は<body>~</body>内に入力するのです。

<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Language" content="ja" />
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis" />
<title>タイトル入力個所</title>
</head>
<body>
はじめまして
</body>
</html>

§02-02

(02) このままブラウジングしても問題なく文章が表示されるのですが、これは正しいXHTML文ではありません。XHTMLではテキスト(文字群)を『タグ』と呼ばれるキーワードで囲む必要があります。段落を意味するタグは<p>です。タグは必ず半角小文字で入力する必要があります。[開始タグ]はそのまま<p>と入力しますが、[閉じタグ]は</p>のように先頭括弧の後にスラッシュを入力するのです。以下のように変更してください。

<?xml version="1.0" encoding="Shift_JIS"?>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Strict//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-strict.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="ja" lang="ja">
<head>
<meta http-equiv="Content-Language" content="ja" />
<meta http-equiv="Content-Type" content="text/html; charset=shift_jis" />
<title>タイトル入力個所</title>
</head>
<body>
<p>はじめまして</p>
</body>
</html>

(03) 作成したテキストを「re01.htm」という名前で「練習1」フォルダーに保存し、ブラウジングしましょう。