すべての要素にスタイルを設定する

目次

すべての要素にスタイルを設定する場合の記述を紹介します。

書式

すべての要素を対象とする場合は"*"記号を用います。

*{
  (スタイル記述)
}

コード

下記のコードを記述します。

AllSelector.css

* {
  font-size:18px;
  color:#808080;
}
解説

すべての要素のフォントサイズを18pixelに、文字色を#808080(灰色)に設定しています。

AllSelector.html

<!DOCTYPE html>
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
    <title></title>
    <link rel="stylesheet" type="text/css" href="AllSelector.css" />
</head>
<body>
    ページです。
    <h1>H1 見出しです</h1>
    <h2>H2 見出しです</h2>
    <h3>H3 見出しです</h3>
    <p>段落です。 あいうえおかきくけこ</p>
</body>
</html>

表示結果

上記のHTMLファイルを表示すると下図の結果となります。h1,h2,h3,pすべての要素が同じフォントサイズ、文字色で表示されています。
すべての要素にスタイルを設定する:画像1

このページのキーワード
  • すべての要素にスタイルを指定する
  • すべての要素にスタイルを適用する
AuthorPortraitAlt
著者
iPentecのメインデザイナー
Webページ、Webクリエイティブのデザインを担当。PhotoshopやIllustratorの作業もする。 最近は生成AIの画像生成の沼に沈んでいる。
作成日: 2013-01-16
Copyright © 1995–2025 iPentec all rights reserverd.