CSSの継承について

トップページ＞ CSSの継承について

CSSの継承について

CSSを使用してホームページ制作をしていく中で気を付けておきたいことの一つとして、継承というものがあります。

ホームページ制作でHTMLを使用してコーディングをしていく際には、要素という塊で指定をして記述していきます。要素とは、タグの開始から終了までで囲まれた部分の事、つまり<html>～</html>や<body>～</body>で囲まれた部分のことが要素となります。
ホームページはこの要素の中に要素が入るといった入れ子の形になって作られることになりますが、このとき外側になるものを親要素、中に入るものを子要素と言います。

継承とは、こういった作りのときに、親要素に指定したスタイルなどの設定を子要素が引き継ぐといった働きのことを指すのです。

また、何も指定をしない場合には子要素にも親要素の指定がそのまま引き継がれるといったことになりますが、もしも子要素に別の指定をした場合には、継承されたスタイルに後から子要素に加えた指定が上書きされるといったことになります。

このように、子要素には継承された指定に加えて新たな要素を上書きすることが可能ですが、この際注意が必要な場合もあります。
例えば、文字の大きさなどを%やemを値として指定するときに、親要素に2em、子要素に2emと指定をしたりすると、子要素の部分では継承した2emを2emする、つまり4emとなって表示されてしまうといった特徴があるのです。これが原因となって、レイアウトが崩れてきてしまうと言うことにもなりかねませんので、十分注意するようにしましょう。
特に、HTMLの場合には、多くの入れ子を使用することになるので、どの要素にどういった指定をしたのか、その指定が子要素にまで継承されるものなのかをしっかりと把握しておかないと後々入れ子が複雑になるにつれてレイアウトが崩れたときにどこからの継承が原因となっているのかということなどがわからなくなってしまい修正に手間がかかってしまうといった自体も起こりかねませんので注意しましょう。

継承は、何ども同じスタイルを指定するといった手間を省くことができたり、多くの指定をしなくて済む分ソースがスッキリとしたりといった利点もありますが、指定したくない部分にまで継承によってスタイルが指定されてしまったりといった欠点もありますので、よく理解して上手く継承をホームページ制作の中にいかしていけるようにしましょう。

ホームページ制作会社　一覧

ホームページ制作東京: ホームページ制作会社のフューチャーは、東京都の品川区でホームページ制作を格安で行っております。お打ち合わせは、東京、千葉、神奈川、埼玉まで無料でお伺い致します。
WEBディレクター: ホームページ制作会社の現役ＷＥＢディレクターがためにＷＥＢ制作、ディレクションについて語ります。
ホームページ制作会社の営業日記: ホームページ制作会社の営業人がホームページ制作の現場をリアルに伝えます。
ホームページ制作基礎知識: ホームページ制作会社の窓口である事務員がＷＥＢの基礎知識を書いています。
ＷＥＢコーダー: ホームページ制作会社に必ず必要なプロのＷＥＢコーダーが惜しげもなく、テクニックを公開しています
ＷＥＢコンサルタント: ホームページ制作の受注をとるためには、ＷＥＢコンサルタントがお客様のご要望を正確に吸い上げる必要があります。
そんな体験談でしたらこちらを参考下さい。

CSSの継承について