付けることになっている(ダブルコロンと呼ばれる)。両者の区別がなかった頃の古いブラウザーとの互換性のため、「コロン」一つで記述するのが一般的となっている。略であり、階層とか段階とかいう意味である。SSとはスタイルシートの略である。CSSの一部のプロパティ値は、親要素から子要素へと継承されていく。継承されるプロパティの例である。すれば、あらゆる要素に文字サイズを指定しなくても、ページ中のすべての要素の文字サイズが14pxとなってくれる。指定すれば、“aaa”というクラス名をもつdiv要素の中ではすべての要素の文字サイズが12pxとなってくれる。スタイルの継承はプロパティごとに行われるので、親要素のすべてのスタイルを継承しながら、一部のスタイルのみを指定によって書き換える、ということも可能である。次に、スタイルの重ね合わせについて。いうクラスセレクターにそれぞれスタイルが設定されているとき、“bbb”というクラス名をもつp要素には両方のセレクターが当てはまるので、両方のスタイルが適用される、つまり文字はサイズが16pxかつ、色が青になる。これを応用すれば、様々なセレクターの指定のしかたを使い分けることによって、CSSの記述量を削減したり、まとめて指定したりできるようになる。書かなくてもいいことになる。スタイルの重ね合わせもプロパティごとに行われる。以上のように、プロパティ値は継承や重ね合わせによって「階層的に」適用されていくのがわかる。ここで、じゃあ複数のセレクターで同じプロパティを指定し、プロパティ値が競合したらどうなるのかという疑問が出てくるが、それについては次の節で説明する。セレクターの優先度ある要素に当てはまる複数のセレクターにおいて、同一プロパティに異なる値が指定されている状態、つまり競合が起こった場合、一定の優先度によって適用されるスタイルが決まる。優先順位の低いセレクターのプロパティは優先順位の高いセレクターのプロパティに上書きされる。その優先順位は以下のリストの通りである。同一のセレクター内にある場合、ソース上で後にあるプロパティブラウザが持つ内蔵CSSの記述この優先順位を利用して、クラス名やID名をHTMLタグに付けたり、セレクターを詳細に指定したりすることで、本来適用されるスタイルを上書きすることができる。Web開発者はこの優先順位に留意して、思わぬ競合が起こらないようにしなければならないが、この優先順位を覆し、指定したプロパティを最優先で適用することができる禁呪が存在する。14px;}CSSの記述。大好き</p>HTMLの記述。上の記述の場合、p要素の文字サイズは本来、クラス名二つが当てはまるセレクターの14pxが適用されるはずが、クラス名一つしか当てはまらないセレクターの20pxが適用されることになる。属性よりも優先して適用されるようになる。この禁呪は正しく使えば便利なのだが、とかく駆け出しの魔法使いWeb開発者は多用してしまいがちで、注意を要する。使いすぎると、CSSが思い通りにならないときに、どこかでこれを使ったのが原因であることに気付きにくく、またどこで使ったのか見つけにくいからである。しで競合してしまった場合、どのスタイルが適用されてしまうのかが定義されていないらしい。思わぬ不具合の温床となるので、駆け出しの魔法使いWeb開発者にはこの禁呪を使ってほしくないのである。よって、できればこの禁呪には頼らず、セレクターの詳細度や記述順を工夫してCSSを書いてほしい。まとめ今回はCSSの初歩からよく使うレイアウトまで、長々と紹介した。今までの記事で「いつかCSSによるレイアウトを紹介する」と二度も言っていたようだが、まだ書いてなかったので。CSSはHTMLと違って、いきなり覚えることが多くて大変だと思うので、一つずつ身に付けてWebページをデザインしながら習得していってもらえれば。今回の記事では俺が初心者にとって重要だと思う事項を優先的に紹介したつもりだが、初心者には難しすぎるところがあったり、逆に大事なところが抜けているかもしれない。いうところに気付いたら、この記事の内容を修正していく予定だ。質問があったら遠慮なくコメントとかTwitterへの返信などしてもらえれば。プロじゃないので相談料は無料である。そのかわり、解決を約束することもない。なんか例文がおかしかったような気もするが、あくまで例なので気にしないでほしい。(2016/11/20)こめんとコメントはまだありません。こめんとする本文のみ必須。メールアドレスは公開されないよ。お名前メアド名前とメアドを入力欄に記憶する数式の空欄を正しく埋めてね。※本文には日本語を最低でも“何文字か”含めてね。(詳細)コメントを投稿すると、メールアドレスを含む投稿内容と、投稿者を識別するIPアドレスなどが当サイトのサーバーに送信され、保持される。これらの情報は当サイトのサービスの提供やコンテンツの改善のために利用される。あなたは、当サイトによるこれらの情報の取り扱い(取得・処理・利用)に同意しなければ、コメントを投稿することはできない。この同意の要件は法的な要件として追加されたもので、当サイトによるこれらの情報の取り扱いは従来から変わっていない。当サイトの個人情報の取り扱いについて詳しくは、プライバシー・ポリシーを読んでね。(126)※過去30日間の閲覧数データによる。