html・css 冒頭に記載
…補足・定型
htmlについて記載する方法が分からないので今回はhtmlでなく通常表示機能を使って記入。
理解しにくかった部分に注釈
■html～頭に記載＜headタグ＞～
<!DOCTYPE html>
<html lange="ja">
<head>
<meta charset="utf=8">
タイトル
<title>PHOTO BOOK</title>
説明文
<meta name="description" content="テキストテキストテキストテキスト">
viewport設定
<meta name="viewport" content="width=device-width,initial-scale=1">
ロゴ（タグのアイコン）設定
<link rel="icon" type="image/ico" href=img/favicon.ico>
例) link rel="icon"
type="image/ico" (icoは拡張子のこと他にもpng.svgなどもある)
href="img/favicon.ico”（画像の名前）
リセットCSS･･･定型 ress.cssで検索して貼り付け
<link href="https://unpkg.com/ress/dist/ress.min.css">
自作CSS･･･フォルダのcssを参照にする
<link href="style.css" rel="stylesheet">
</head>
■CSS～頭に記載＜文字化け防止＞～
@charset "UTF-8";
■html 他のタグ
・footer
<small>©＝© が表示される
例)<footer>
<div class="wrapper">
<p><small>©表示したい内容K</small></p>
</div>
</footer>
・画像系
画像UP
例 <div class="mainvisual">
<img src="img/mainvisual.jpg" alt="メインビジュアル">
画像にリンク機能付与
例)<a href="リンク先">
<div class="mainvisual">
<img src="img/mainvisual.jpg" alt="メインビジュアル"> </a>
headerをwrapperで包む
例)<header id="header" class="wrapper">
ヘッダーのロゴにでindex.html"にもどってくるよう仕込む
例)<a href="index.html"><img src="画像リンク先" alt="画像説明"></a>
ヘッダーのロゴにh1適用させる（ h1タグは画像でも使える）
例)<h1 class="site-title">
<a href="index.html"><img src="img/logo.svg" alt="PHOTO BOOK"></a></h1>
※参考サイト： h1タグは画像でも問題ない！画像を設定する時のポイント3つ！