HTMLを記述する際の細かい要素について！

13190 ワード
CSS HTML HTML テキストリンク

結論！

head要素とbody要素には、それぞれ細かい要素があります！

head要素の記述は、ブラウザ上には表示されない!

body要素には、ブラウザ上に表示される情報を記述する!

以上の事が答えだと思います！

では、細かい要素について書いていきたいと思います！

①.title要素

＊head要素の中に記述します！

ウェブサイトのタイトルを指定する要素です！

title要素内にタイトルを記述してもウェブサイトの画面上には表示されません！

ブラウザのタブに表示するタイトルとして使用されます！

下記が記述例です！

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="UTF-8">
    <title>HTML勉強用ウェブサイト</title>
  </head>
  <body>
  </body>
</html>

開始タグ　＝　< >』と、終わりを示す『終了タグ　＝　</ >』で囲みます！

これでタブにタイトル情報が表示されます！

②.　h１〜h６要素（見出し要素）

＊body要素の中に記述します！

hはHeadingの略です！

hから始まるh1/h2/h3/h4/h5/h6の要素は文章の見出しを作るための要素です！

見出し要素はh1からh6まで存在します！

h1〜h6のタグに囲まれたテキストは見出しとして強調され、

h1から順に文字の太さと大きさが小さくなります！

下記が記述例です！

<body>
    <h1>
      ここは見出しです
    </h1>
  </body>

開始タグ　＝　< >』と、終わりを示す『終了タグ　＝　</ >』で囲みます！

これにより見出しが表示されます！

③.p要素

＊body要素の中に記述します！

pはParagraphの略です！

文章の段落を表す要素です！

<　p　>...<　/p　>で囲むとひとかたまりの段落として認識されます！

Webページ内では、見出しを除くテキストのほとんどが、このp要素を使って作られます！

下記が記述例です！

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="UTF-8">
    <title>HTML勉強用ウェブサイト</title>
  </head>
  <body>
    <h1>
      ここは見出しです
    </h1>
    <p>
      1つ目の段落
    </p>
    <p>
      2つ目の段落
    </p>
    <p>
      3つ目の段落
    </p>
  </body>
</html>

開始タグ　＝　< >』と、終わりを示す『終了タグ　＝　</ >』で囲みます！

これにより文章が段落して表示されます！

④.b要素

＊body要素の中に記述します！

bはBoldの略です！

文字でを太くする要素です！

<　b　>...<　/b　>で囲まれている部分だけ太字になります！

下記が記述例です！

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="UTF-8">
    <title>HTML勉強用ウェブサイト</title>
  </head>
  <body>
    <h1>
      ここは見出しです
    </h1>
    <p>
      1つ目の段落
    </p>
    <p>
      2つ目の段落
    </p>
    <p>
      3つ目の段落<b>この部分は太字になる</b>
    </p>
  </body>
</html>

開始タグ　＝　< >』と、終わりを示す『終了タグ　＝　</ >』で囲みます！

これにより文章が太字で表示されます！

⑤.br要素

＊body要素の中に記述します！

brはLine Breakの略です！

テキストを改行するための要素です！

br要素をテキストの中で用いることで、改行ができます！

br要素は終了タグが『不要』です！

下記が記述例です！

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="UTF-8">
    <title>HTML勉強用ウェブサイト</title>
  </head>
  <body>
    <h1>
      ここは見出しです
    </h1>
    <p>
      1つ目の段落
    </p>
    <p>
      2つ目の段落
    </p>
    <p>
      3つ目の段落<br>
      4つ目の段落<br>
    </p>
  </body>
</html>

改行箇所に『開始タグ　＝　<　br　>』のみ記述します！

これにより文章が改行して表示されます！

⑥.a要素とhref属性

＊body要素の中に記述します！

a要素はAnchorの略です！

<　a　>...<　/a　>で囲ったテキストをリンクにすることができます！

a要素をクリックすると特定のページに移動します！

aタグのhref属性に、移動させたいページのURLを指定します！

hrefはHyper Referenceの略です！

href属性でリンクの移動先を指定します！

URLや移動させたいページのHTMLファイルが置いてあるフォルダの場所を指定することで、

特定のページへのリンクが作成出来ます！

下記か記述の形です！

<　a href="移動させたいページのURL">リンクにしたい文字<　/a　>

下記が記述例です！

<!DOCTYPE HTML>
<html>
  <head>
    <meta charset="UTF-8">
    <title>HTML勉強用ウェブサイト</title>
  </head>
  <body>
    <h1>
      ここは見出しです
    </h1>
    <p>
      1つ目の段落
    </p>
    <p>
      2つ目の段落
    </p>
    <p>
      3つ目の段落<b>この部分は太字になる</b>
    </p>
      　<a href="https://www.google.com/">クリックすると、Googleへアクセスします</a>
  </body>
</html>

開始タグ　＝　< >』と、終わりを示す『終了タグ　＝　</ >』で囲みます！

これにより文章に表示され、別ページへ移動することができるリンクを生成できます！

まとめ

それぞれの要素の役割と書く場所を理解しておけば問題ないですね！

個人的には、1個１個確認していけばやれるような気はしています！

まぁ実際の現場などではそうはいかないと思いますが、、、^^;

何か説明で間違っていたらご指導お願い致します(_ _)

Oozie shell script action
java.util.ConcurrentModificationException at java.util.ArrayList$ArrayListIterator.next(ArrayList.