CSSの概要

4842 ワード
TIL CSS テキストリンク

CSS : Cascading Style Sheets


cssはルールベースの言語です.
cssを使用して、特定の、要素、または特定の要素のセットのスタイルルールを定義できます.
  • セレクタ:スタイルを指定するHTML要素
    • を選択します.
  • 宣言ブロック(declocation block):カッコ内に複数の宣言
    • を作成する
  • 宣言(declarations):Propertyと値からなるペア

    • CSSの適用方法

  • 内蔵スタイル、
    • <head>
  <style>
    h1 { color: red; }
  </style>
</head>
<body>
  <h1>Welcome!</h1>
</body>
  • 行内スタイル、
    • に適用
    <head></head>
<body>
  <h1 style="color:red">Welcome</h1>
</body>
  • 外形、
    • <head>
  <title></title>
  <link rel="stylesheet" href=“style/main.css” />
<head>

    積層の原則

  • スタイル優先度
  • と同じデザインでも、宣言された場所によって優先順位が決まります.
    ブラウザ定義スタイル<開発者宣言スタイル<ユーザ構成スタイル
  • 適用範囲が小さいほど優先
    tagスタイル後に
  • ソースコードの順序がある場合は、それを上書きします.
  • スタイル継承
  • 親要素のスタイル属性が子要素に渡されます.
    サブエレメントで再定義すると、親エレメントのスタイルが上書きされます.
  • を継承しない属性もあります.(ex背景画像、背景色等)
    • HDu 1542走査線