CSSリセットやCSSベースラインと呼ばれるカテゴリに属するスタイルシート

nomalize テンプレート必読です

HTML内の構造

ヘッダー内

               修正版の順番例
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>CS</title>

<!-- ? リセットCSSを最初に -->
<link rel="stylesheet" href="./reset.css">

<!-- ? Google Fonts -->
<link rel="preconnect" href="https://fonts.googleapis.com">
<link rel="preconnect" href="https://fonts.gstatic.com" crossorigin>
<link href="https://fonts.googleapis.com/css2?family=Noto+Sans+JP:wght@100..900&display=swap" rel="stylesheet">

<!-- ? sanitize.css(リセットに少し上書き) -->
<link rel="stylesheet" href="https://unpkg.com/sanitize.css">

<!-- ? 独自スタイル(最優先で上書き可能) -->
<link rel="stylesheet" href="./style.css"></head>

               
            

CSSリセット(CSS Reset)で過去のCSSの影響を受けずに、新たなファイルで実行する

reset.css は、全てのブラウザのデフォルトスタイルを強制的に「ゼロ(初期化)」に近づけることを目的としたスタイルシートです。装飾なども完全に消えるため、自分で全部スタイルを書く必要あり

CSSノーマライズ(CSS Normalization)・サニタイズCSS / Sanitize.cssこれらとは違います

? 実例reset.css(外部ファイル)、このページではstyleタグ内に記述
/* Eric Meyer's Reset CSS v2.0 - http://meyerweb.com/eric/tools/css/reset/ */
            html, body, div, span, applet, object, iframe,
            h1, h2, h3, h4, h5, h6, p, blockquote, pre,
            a, abbr, acronym, address, big, cite, code,
            del, dfn, em, img, ins, kbd, q, s, samp,
            small, strike, strong, sub, sup, tt, var,
            b, u, i, center,
            dl, dt, dd, ol, ul, li,
            fieldset, form, label, legend,
            table, caption, tbody, tfoot, thead, tr, th, td,
            article, aside, canvas, details, embed,
            figure, figcaption, footer, header, hgroup,
            menu, nav, output, ruby, section, summary,
            time, mark, audio, video {
            margin: 0;
            padding: 0;
            border: 0;
            font-size: 100%;
            font: inherit;
            vertical-align: baseline;
            }
            article, aside, details, figcaption, figure,
            footer, header, hgroup, menu, nav, section {
            display: block;
            }
            body {
            line-height: 1;
            }
            ol, ul {
            list-style: none;
            }
            blockquote, q {
            quotes: none;
            }
            blockquote::before, blockquote::after,
            q::before, q::after {
            content: '';
            content: none;
            }
            table {
            border-collapse: collapse;
            border-spacing: 0;
            }