CSS基礎①

HTMLの復習

  • デベロッパーツールを使う
  • ファイルの管理はきちんとしておく(バックアップは必須)
  • 階層を考える作業をしておく
  • 絶対パス・相対パスを理解しておく
    上の階層にあるのか?フォルダの中に入っているのか?
  • ファイル名、フォルダ名は半角英数のみ

CSSの復習

  • CSS
    見た目、デザイン
  • リセットCSS
    ブラウザにすでに決めてしまったスタイルシートがあるので、それをリセットすること
    (昔は全部リセットしていたが、今は何をリセットするのか人によってちがう)
  • セレクタ{ プロパティ : 値 ;}
  • 記入例
    h1{
      color : red ;
      font-size : 200% ;
      font-weight : bold;
    }
  • 色やフォントサイズもまとめることもできる!
    記入例(コンマで区切る)
    h1,h2,h3{
         color : blue ;
         font-weight ; bold;
    }

デベロッパーツールの使い方 :参考URLhttps://willcloud.jp/knowhow/dev-tools-01/#Windows

バックグランド系プロパティ

  • background-color プロパティ(背景色)
  • background-attachment プロパティ(背景画像の位置)
  • background-image プロパティ(背景画像のファイル)
  • background-repeat プロパティ(背景画像の繰り返し)
  • background プロパティ(背景の一括指定)
  • background-size プロパティ(背景画像のサイズ)
  • background-position プロパティ(背景画像の表示開始位置)

テキスト系プロパティ

  • color プロパティ(文字の色)
  • opacityプロパティ(透明度)
  • text-align プロパティ(文字の配置)
  • text-decoration-color プロパティ(文字飾りの色)
  • text-decoration-style プロパティ(文字飾りの線種)
  • text-decoration-thickness プロパティ(文字飾りの線の太さ)
  • text-decoration プロパティ(文字の飾りの一括指定)
  • text-shadow プロパティ(文字の影)

フォント系プロパティ

  • font-family プロパティ(フォントの種類)
  • font-size プロパティ(フォントのサイズ)
  • font-weight プロパティ(フォントの太さ)
  • font-style プロパティ(フォントのスタイル)
  • line-height プロパティ(行の高さ)
  • font プロパティ(フォント一括指定)
  • white-space プロパティ(空白・改行の表示方法)
  • word-wrap プロパティ(単語の途中での改行方法)
  • word-break プロパティ(テキストや単語の改行方法)
  • tab-size プロパティ(タブ文字の表示幅指定)

リスト系プロパティ

  • ist-style-type プロパティ(リストマーカーの種類)
  • list-style-image プロパティ(リストマーカーの画像)
  • list-style-position プロパティ(リストマーカーの位置)
  • list-style プロパティ(リストマーカーの一括指定)
タイトルとURLをコピーしました