ホームページつくるぞ!! -4ページ目

body要素内 基本的なタグ

body基本情報

コメントを挿入

<!-- -->で囲む

<!--ここは本文には表示されません-->


見出し

入力 表示
<h1>見出し1</h1>

見出し1

<h2>見出し2</h2>

見出し2

<h3>見出し3</h3>

見出し3

<h4>見出し4</h4>

見出し4

<h5>見出し5</h5>
見出し5
<h6>見出し6</h6>
見出し6

段落

<p>この中が段落</p>
改行は<br>を入れる。


<body>タグにただ文章を書き込んだだけでも表示されるが、
文法上よろしくないので、<p>で囲む


改行

<br>を入れることで改行される


水平線

<hr>を入れることで水平線が挿入される


要素の見栄えを整える属性(W3C非推奨)

見出し要素、p要素に指定できる属性

属性 属性値 説明
align left center right 表示位置の指定 左 中央 右

hr要素に指定できる属性

属性 属性値 説明
color

カラーコード or

色名

水平線(hr)の色を指定
align left center right 表示位置の指定 左 中央 右
size 1以上の整数 高さを指定
width 1以上の整数 横幅を指定

metaタグを使ったページ情報の埋め込み

head要素内には、<meta>タグを使って、文字コード以外の情報もを埋め込むことができます。


<meta http-equiv="属性" content="内容を記述">

属性 記述する内容
description ページの説明文
keywords ページのキーワード
author 制作者名
copyright 著作権
reply-to 連絡先
build 制作年月日
expires 失効日

ブロック要素とインライン要素

  • ブロックレベル要素
  • 見出し・段落・リスト・テーブル・引用・divなど

    一つの領域を示す。
    データを入れる箱となる要素。
    ブロックレベル要素が続く時は改行される。

    参考
    body要素のすぐ下には、ブロックレベル要素しか置くことが出来ない

    要素の種類 内容
    h1~h6 見出し
    p 段落
    ul,ol,li リスト
    table,tr,td,th テーブル
    blockquote 引用
    div


  • インライン要素
  • ブロックレベル要素内の特定の部分に役割や機能をもたせる

    中にブロックレベル要素を含むことが出来るが、
    中にインライン要素を含むことはできない
    インライン要素が続く時は改行されずに横に並ぶ

    要素の種類 内容
    a リンク
    em 強調
    strong 強調斜体
    span インライン要素指定