検索

キーワード


目次

【HTML】タグについて

  • 公開日:2020-10-13 17:41:03
  • 最終更新日:2020-11-20 00:05:15
【HTML】タグについて

Workteria(ワークテリア)では難易度の高いものから低いものまで、スキルや経験に合わせた案件を多数揃えています。会員登録は無料ですので、ぜひ会員登録してご希望の案件を探してみてください!

フリーランス/正社員のエンジニアとして活躍するには、ご自身のスキルや経験に合わせた仕事を選ぶことが大切です。ご希望の案件がみつからない場合はお気軽にお問い合わせください!ユーザ満足度の高いキャリアコンサルタントが在籍していますので、希望条件や悩み事などなんでもご相談ください。ご希望にピッタリの案件をご紹介させていただきます。

こんにちは。駆け出しプログラマーの石井です。

こちらではHTMLのタグについて説明します。

勉強するうえでの参考になれば幸いです。

HTMLのタグとは

「HTML」とはHyper Text Markup Language(ハイパーテキスト・マークアップ・ランゲージ)の略称です。Webページを制作する為の「基礎言語」です。

「基礎言語」で視覚表現や文章の構造などを記述するタグを使用します。

タグには決まりごとがあります。タグとは、<>でページの要素名を囲っているもので、基礎的なタグの書き方は以下のようになります。<>は開始タグで</>は終了タグになります。

【例】 <タグ名>記述内容</タグ名>


HTMLタグの具体例

<p></p>

p要素 ブロックレベル要素

ひとつの文書のかたまり、段落で使用されます。


<b></b> インライン要素

文章内で強調したい部分などに使用されるタグです。bタグで挟まれた文字は太字になります。


<strong></strong> インライン要素

文章内でさらに強調したい部分、重要な部分に使われます。<strong>〜</strong>で挟まれた文章内で、さらに<strong>〜</strong>で囲むことで強調の段階をつけることができます。


<br>

改行を行うためのタグです。終了タグなしで使います。


<ul></ul>

ul要素 ブロックレベル要素

配置する文章のリストに、番号などの情報を持たせない場合に使用します。


<ol></ol>

ol要素 ブロックレベル要素

配置する文章のリストに、番号の情報を持たせる場合に使用します。


<li></li> ブロックレベル要素

1つのリストを意味するタグで、必ず<ul>〜</ul>か<ol>〜</ol>のリストタグに囲まれます。


<table></table> ブロックレベル要素

テーブルと呼ばれる表を作成するタグです。基本的にこの<table>〜</table>タグ内に表の内容の記述をしていきます。


<tr></tr>

表の横一列(行)の定義をします。<tr>〜</tr>内に<th>や<td>タグでセルの記述を行います。


<th>

表の中の見出しが入ったセルを定義します。


<td>

表の中のデータ(通常の文章)が入ったセルを定義します。


<a></a>

a要素 インライン要素

Webページ内で別のページにリンクさせる時などに使用します。<a>タグにhref属性でURLを指定します。またtarget属性でリンク先の開き方を指定することができます。


<img>

img要素 インライン要素

画像を配置し、終了タグを必要としないタグです。画像のあるURLを記述します。heightなどで画像サイズの記述を行います。


よく使うタグ一覧

<head>  文書の情報を表意味する


<meta> キーワードやメタディスクリプションなどの関連情報を意味する


<title> ページのタイトルを意味する


<link> 関連するファイルを読み込む


<body> ユーザーに見える文書の情報を意味する


<h1>~<h6> 見出しを作る




【著者】

石井雅人

こんにちは、駆け出しのプログラマーの石井雅人です。 まだまだ未熟者ですが一緒に頑張っていきましょう! 趣味はアニメや声優・それらのライブに行くことです。

編集した記事一覧

正社員/フリーランスの方でこのようなお悩みありませんか?

  • 自分に合う案件を定期的に紹介してもらいたい
  • 週2、リモートワークなど自由な働き方をしてみたい
  • 面倒な案件探し・契約周りは任せて仕事に集中したい

そのような方はぜひ、Workteriaサイトをご利用ください!

  • 定期的にご本人に合う高額案件を紹介

  • リモートワークなど自由な働き方ができる案件多数

  • 専属エージェントが契約や請求をトータルサポート

よく読まれている記事
【HTML/CSS】divタグの使い方

【HTML/CSS】divタグの使い方

こんにちは。駆け出しプログラマーの松下です!HTMLで頻繁に見かけるdivタグとはどんなものかを紹介します。HTMLを学び始めたばかりという方の参考になれば幸いです!divとはdivタグはそれ自身は特に意味を持っていませんが、構造上必要なひとかたまりを示します。例えば、下記のように文字の色を赤にしたいときに、CSSでとを別々に赤色と指定するのは面倒です。HTMLファイル赤い果物 りんご CSS

【HTML】リンクタグについて

【HTML】リンクタグについて

こんにちは。駆け出しエンジニアの竹前です。ここでは、HTMLのリンクタグについて説明します。HTMLについて勉強している方の参考になれば幸いです。リンクタグとはリンクタグとは、HTMLの閲覧中のページから、別のページに遷移させるときに使うタグ(~タグ)のことをいいます。このタグを使うことによって、文字列や画像にリンクを設定することができます。タグとタグの違いHTMLにはタグというものがあります。タ

【HTML/CSS】リストについて

【HTML/CSS】リストについて

こんにちは。駆け出しプログラマーの松下です!リストを作成するol、ulタグを紹介します。HTMLを学び始めたばかりという方の参考になれば幸いです!リストをつくるHTMLで箇条書きを行うには ol、ul、liタグを使用します。このタグによりただの言葉のあつまりでなく、ひとつのまとまりをもったリストであるということをコンピューターに伝えることができます。ol、ulタグでリストを作成し、その項目にliタ