『自分の仕事は自分でクリエイト』を目指す新米クリエイターたちのアウトプット用Webマガジン

HTML03 HTMLの基本的なタグ(改行、水平線、引用文、強調)(4分58秒)

HTMLの基本的なタグ(改行、水平線、引用文、強調)

今回は、HTMLの基本的なタグ(改行、水平線、引用文、強調)について解説しています。

ソース

<!DOCTYPE html>
<html lang="ja">
<head>
<meta charset="utf-8">
<title>HTMLの練習です!</title>
</head>
<body>
<h1>ビストロ・ドゥ・リヨン</h1>
<hr>
<h2>本格フレンチの味を気軽に楽しめる ビストロ・ドゥ・リヨン</h2>
<p>フレンチをもっと楽しく!<br>もっと気軽がコンセプト</p>
<p>フランス料理の<em>伝統的な定番料理</em>を、<strong>緑が見える</strong>店内でゆっくりとお楽しみください。</p>
<h3>パーティープランのご案内</h3>
<p>記念日や季節のイベント、同窓会など各種パーティーに対応</p>
<p>和やかな雰囲気で、ステキな時間を。</p>
<blockquote>
<p>引用文です。引用文です。引用文です。引用文です。引用文です。</p>
<p>引用文です。引用文です。引用文です。引用文です。引用文です。</p>
<p>引用文です。引用文です。引用文です。引用文です。引用文です。</p>
<p>引用文です。引用文です。引用文です。引用文です。引用文です。</p>
<p>引用文です。引用文です。引用文です。引用文です。引用文です。</p>
</blockquote>
</body>
</html>

HTMLタグ解説

終了タグがないHTMLタグ

<br>
段落の中で改行したい場合、テキスト上で改行しただけではブラウザ上では改行されません。
改行は<br>を使用します。
<br>は、line break(ラインブレイク)の略です。
タグで挟むことのないタイプなので終了タグはありません。
<hr>
水平線は<hr>を使用します。
<hr>は、horizontal rule(水平線)の略です。
タグで挟むことのないタイプなので終了タグはありません。

引用文を表すためのタグ

<blockquote>~</blockquote>
他のホームページや参考文献の文章を引用するときには引用を表すためのタグを使います。
引用は<blockquote>~</blockquote>を使用します。
<blockquote>は、long Quotation inblok(長い引用)の略です。
blockquote要素の中のテキストは、pタグで囲む必要があります。

テキストを装飾するタグ

<em>~</em>
文字を強調したい場合は、<em>タグを使用します。
<em>は、emphasis(エンファシス 強調)の略です。
<strong>~</strong>
より強調したい場合は、<strong>タグを使用します。
<strong>は、strong emphasis(ストロングエンファシス より強い
強調)の略です。

この記事が気に入ったら
いいね ! しよう

福本 智子

フリーランスWebデザイナー・Webスクール講師。 子育てをしながら、趣味で始めたネットショップからWebを活用したビジネスの楽しさにはまり、Web屋の道を歩む。 Web制作業務に加え【Webデザインを学びながらビジネス力も身につける体験型スクール&コミュニティ】を運営。 フリーランスでWebデザイナーを目指す方々のサポートに注力している。

Pocket
LINEで送る

関連記事

ライター紹介

Webメディア部 メンバー募集!

  • Webデザインを学びながらビジネス力も身につける体験型スクール&コミュニティ Webクリエイターズオンラインスクール

ログイン

新米クリエイターズ Webメディア部

『自分の仕事は自分でクリエイト』を目指す新米クリエイターたちのアウトプット用Webマガジン。

Web・DTPデザイナー・会社員・アルバイト・ライター・ブロガー・主婦・子育てママ...etc。
現在の肩書きは違えど目指すところは皆「フリーランスのWebデザイナー(クリエイター)」

日々の学びやお役立ち情報をブログで発信・アウトプットをしながらWebの世界でコンテンツを配信する、
Webサイトを運営する、アクセスを集めるってどんなことなのか?を体感していきます。

新米クリエイターならではの気づきや学び、Webデザイナーの腕を磨いていく模様をリアルに感じていただけます!