HTMLとは
ホームページ(ウェブサイト)は、HTMLHyper Text Markup Language）というコンピュータ言語でできています。言語といっても決して難しく考える必要はないので肩の力を抜いて学習していきましょう。HTMLは、「文書構造」を指定する「タグ」の集合体です。(タグの集合体をソー
学びと教え | 教育の現場から
ホームページ(ウェブサイト)は、HTMLHyper Text Markup Language）というコンピュータ言語でできています。言語といっても決して難しく考える必要はないので肩の力を抜いて学習していきましょう。HTMLは、「文書構造」を指定する「タグ」の集合体です。(タグの集合体をソー
HTMLは、タグの集合体です。タグとは、「<」「>」(山かっこ)不等号記号で囲ったものです。前のタグを「開始タグ」、後ろのタグを「終了タグ」といいます。開始タグから終了タグで囲った中身を要素といいます。タグは、それぞれに意味を持っています。テキストや画像にタグをつける作
全体構造HTMLは人の身体に似ています。HTMLは大まかに、「文書型宣言(DTD)」「ヘッダ情報(head)」「ボディ要素(body)」で構成されています。人は、ヘッド ＝(head)は、頭の部分ですね。HTMLでは、(head)＝ヘッドといいます。ヘッダ情報は、人でいうと性格や思考、記憶
<title>タイトルウェブサイトのタイトルを入力しましょう。タイトルタグは、<head>内にあります。前後の開始終了タグは、消さないようにしてください。<!DOCTYPE html><html><head><
見出しタグHTMLでは、レベル1からレベル6までの6段階の見出しに関するタグが用意されています。レベル1が最上位の見出しとなります。見出しタグは、すべてブロック要素なので、一行開いた状態で改行されます。通常のウェブページでは、h1からh3までは多く存在していることが通常です
HTMLでは箇条書きリスト項目を作ることができます。例えば、果物の種類では、りんご、、バナナ、イチゴなどたくさんの種類をリストアップすることができますよね。リスト項目を一つのグループにしてまとめ、それぞれの項目を記述していきます。番号なしリスト<ul>タグの中に、<
HTMLには、動画や地図、SNSなどを埋め込むことが出来ます。公開されている多くのマルチメディアには、「共有する」という機能が備わっているため、ホームページ上で公開して情報を共有してもらいやすくするためです。動画(YouTube)を埋め込むWebページに、ビデオや音声、アニメーショ
img要素は、ウェブページに画像ファイルを挿入します。src属性でページに挿入する画像ファイルの場所を指定し、alt属性で画像の代替テキストを指定します。img要素は、インライン要素であり、終了タグのない空要素です。※補足説明近年、画像のサイズは、スマートフォンでの閲覧が浸
a要素とhref属性クリックしてページジャンプ(移動)する実装を、「リンク」といます。リンクには、a(hypertest anchor)を利用します。テキストや画像に対してリンクを設定することができます。通常、リンクが設定されると文字列の下に「下線」が引かれ(スタイルシート
表を作るHTMLでは、「表」のことを「テーブル」といいます。テーブルを作成するには、<table>タグを使用します。テーブルの行の定義は、<tr>で記述しさらに一行の間に含まれる「列」を<td>または<th>で定義します。上記
フォームとはホームページには、「お問い合わせ」や「資料請求」などのページが用意されています。氏名や住所、メールアドレスなど項目別に入力し、個人データを収集するコンテンツをフォームと言います。情報が一方的に流れる従来のメディアと異なり、ユーザー（クライアント）が即時にサーバーに情報を送り返す
フォームのパーツフォームの選択項目において、よく使われるフォームパーツについて学習します。タイプ属性それぞれのタイプを識別するため、input type="属性"を指定します。<input type="属性" name="
ボックスを理解するCSSにおけるボックス要素は「ここから → ここまで」で範囲が決まり、ひとつの箱に入れるイメージになります。通常「ブロック要素」となり、特定の範囲をひとつのグループにし、ひとまとまりで扱えるようにします。それらが位置を指定することで、レイアウトされていきます。
CSSは、HTMLにスタイル機能を提供し表示を制御するための言語です。CSSを使用すると、ウェブページのレイアウトを整えることができます。
CSS (Cascading Style Sheets)スタイルシートは、CSS(シーエスエス)とよばれています。HTMLにスタイル機能を提供し表示を制御するための言語です。CSSを使用すると、ウェブページのレイアウトを整えることができます。ウェブページの余白や文字の大きさ、色など
セレクターには、「パターン」と呼ばれる条件が多数定義されています。セレクターの種類をいくつかご紹介しましょう。セレクターの種類*ユニバーサルセレクタ(全称セレクター)すべての要素が対象タグセレクタタイプセレクタータグを直接指定する特定のタグ名を指定IDセレクター
テキストの色 colorテキストの色を指定することができます。以下の記述は、見出し<h1>のテキスト色を「赤」にする指定になります。h1{color:#ff0000;}テキストの色を変更してみましょう。色の値には、「色コード」または「色名」を指定します。【カラー
フォントの種類font-familyユーザーの環境によって表示するフォントの種類が異なるので、複数のフォントを指定するのが一般的です。また、特別に見せ方への拘り、デザイン的な事由などの事情を除き、ゴシック体で表示させるのが一般的です。2025年現在、MacやiPhone
ハイパーリンクによる動作リンク部分をユーザーの動作に応じて、見た目を変えることができます。リンクには、別のウェブページに誘導したり、ファイルをDLしたり、メールアドレスを立ち上げたり様々な挙動があります。リンク擬似クラスハイパーリンク(a href=””)による部
CSSの背景プロパティは、要素の背景に色や画像を設定してデザインを整えるためのものです。ページの雰囲気を大きく変える重要なスタイルです。background-color以下の記述は、背景を赤色にすることができます。background-color:#ff0000;c
floatの役割要素を左右に寄せて、文字や他の要素を回り込ませることができます。floatプロパティを適用された要素は、その親要素コンテンツ領域の「右上」または左上に配置されます。また、後続の要素は、floatが適用された要素を避けるように配置されます。float:値flo
ボックスとは要素は「四層でできた一つの箱（ボックス）」として扱うと覚えればレイアウトが理解しやすくなります。CSSにおけるボックス要素は「ここから → ここまで」で範囲が決まり、ひとつの箱に入れるイメージになります。ボックスは、特定の範囲をひとつのグループにし、「ブロック要素」として、ひと