2025年5月24日

-本日のアジェンダ- 1限目学科 HTML/CSS基礎④CSSの記述方法について 2限目学科 HTML/CSS基礎④CSSの記述方法について 3限目学科 HTML/CSS基礎④Webページ制作実践 4限目学科 HTML/CSS基礎④Webページ制作実践 5限目学科 HTML/CSS基礎④本日の講義のまとめ 本日のテーマ CSSの記述を始めましょう 画像の取り扱いについて【復習】 &lt;img&gt;タグは、画像を表示する際に使用し、必須属性のsrc属性で画像ファイルのURLを指定します。一般的なブラウザで表示できる画像フォーマットとしては、PNG・GIF・JPEGがよく利用されています。 他にも、ウェブ用のベクター画像フォーマットであるSVGや、単一ページのPDF・アニメPNG・アニメGIFなどをsrc属性の値として指定できます。alt属性には、画像が利用できない環境向けのテキストを指定します。 HTML5ではalt属性は必須ではありませんが、指定しておけばアクセシビリティーが高まるでしょう。 参考サイト Webで扱える画像について知ろう！基本の4つの画像形式と … パフォーマンス観点でのWeb用の画像最適化について（2019 … 【2022年版】画像最適化ツールおすすめ10選を徹底比較！ 特殊文字について【復習】 HTMLのコードを記述する時に特別な書き方をする必要のある文字があります。 参考サイト HTMLの特殊文字とは？変換方法と特殊文字一覧も紹介 HTMLで特殊文字を扱う方法 HTMLの記号・特殊文字の文字コード表 CSSの基本構造について【復習】 HTML ファイルとは別に記述する場合 HTML ファイル内に記述する場合 HTML タグにインラインで記述する場合 リセットCSSついて ブラウザは初期状態でタグ単位のデフォルトのスタイルシートを持っています。このデフォルトのスタイルシートの内容はブラウザによって異なるためブラウザ環境を変更すると意図しない表示になることがあります。このような現象を防ぐために使用するのがリセット CSS です。 リセット CSS は、ブラウザが持っているスタイルシートをリセット（クリア）するためのスタイルシートですがリセットする範囲はコーディングスタイルに依存するため、これが正解というリセット CSS は存在しません。各自のコーディングスタイルに合わせて適時変更してください。 Webページ制作実践② 実際にサンプルファイルを使用してWebページ制作の手順を確認していきましょう。 テキスト分類タグについて コンテンツ埋め込みタグについて CSSとの紐付けについて セレクタの記載方法