アトリエ・エクレア

2DCG&3DCG, プログラミング, 日記などを掲載してます。

HTML5

HTML5

※ HTMLはマークアップ言語。

★ HTML5 テンプレート

  <!DOCTYPE html>
  <html lang="ja">
  <head>
   <meta charset="UTF-8" />
   <title>htmlテンプレート</title>
   <link rel="stylesheet" href="my-reset.css" type="text/css" />
   <link rel="stylesheet" href="my-css.css" type="text/css" />
   <script src="my-javascript.js"></script>
  </head>
  <body>
   <p>テンプレートです。</p>
   <img src="img/test.jpg" />
  </body>
  </html>

★ コメント

HTMLのコメント

  <!-- HTMLの一行コメント -->
  
  <!-- HTMLの
  複数行のコメント -->

CSSのコメント

  /* CSSの一行コメント */

  /* CSSの
  複数行のコメント */

JavaScriptのコメント

  // JavaScriptの一行コメント ※改行まで有効

  /* JavaScriptの一行コメント */

  /* JavaScriptの
  複数行のコメント */

★ ハイパーリンク(Hyperlink)

a要素の、href属性の値にパスを指定する。

  <a href="test.html">testページへ</a>

★ 画像

img要素の、src属性の値にパスを指定する。
img要素はインラインレベルの要素

  <img src="../img/test.jpg" width="500" height="300" alt="代替テキスト" />

"../"はひとつ上の階層を示す。
この例では、htmlファイルが入っているフォルダと同じ階層にimgフォルダがあり、その中にtest.jpgがある。


★ リスト

Ordered List

  <ol>
   <li>List_Item_1</li>
   <li>List_Item_2</li>
   <li>List_Item_3</li>
  </ol>

Unordered List

  <ul>
   <li>List_Item_1</li>
   <li>List_Item_2</li>
   <li>List_Item_3</li>
  </ul>

★ ボタン

type属性の種類:

  • submit (送信)
  • reset (リセット)
  • button (自由用途)
  <button type="button">ボタン</button>

★ グループ化 (div要素 と span要素)

  • div要素(ブロックレベル要素): 複数の要素をまとめてグループ化する。
  • span要素(インラインレベル要素): テキストやインライン要素などの行内容をグループ化する。
<div>
	<h1>見出し</h1>
	<p>段落</p>
	<p>段落</p>
<div>
<p>本日は<span>晴天</span>なり。</p>

★ header要素

a

a

★ footer要素

a

a

★ nav要素

a

a

★ article要素

a

a

★ section要素

a

a


マイブログへようこそ♪
PLEASANT_DRAGON

2DCG&3DCG,プログラミング,
日記などを掲載中☆

(*´▽`*)コメント大歓迎です☆

最新記事
記事一覧

全ての記事を表示する

カテゴリ
SAI (0)
mi (2)
C (1)
C++ (1)
C# (0)
VBA (0)
月別アーカイブ
最新コメント
RSSリンクの表示
リンク
FC2ブログランキング

FC2Blog Ranking

ピックアップ商品1♪










カレンダー
07 | 2017/08 | 09
- - 1 2 3 4 5
6 7 8 9 10 11 12
13 14 15 16 17 18 19
20 21 22 23 24 25 26
27 28 29 30 31 - -
ブログ内検索フォーム
プロフィール

エクレア

Author:エクレア


  • 2DCG&3DCGの創作活動をしています。

  • SF系のメカが大好物。

アクセスカウンター
Twitter
ピックアップ商品2♪