CSS入門

ウェブアプリケーションを開発する際にCSSは避けて通れない知識ですので、ここでは軽く説明します。(メモ書きです)

CSSとは
ウェブページの構成とデザイン(色、フォント等)は別に管理することが望ましいという考え方が一般的です。そこで、ウェブページの作成では、HTMLの記述はページの内容や構成を表すことのみにとどめ、デザインはCSSというファイルに記述する枠組みが採用されています。

CSSの書き方と利用方法

CSSファイル
.mystyle{
  background-color:#8f8f8f
}

.mystyleというのは、スタイルのクラス名です(先頭のピリオドを忘れずに)。そしてカッコの中で属性と属性値をコロンを挟んで記述します。行末にはセミコロンをお忘れなく。

HTMLファイル

<div class="mystyle">ああああ </div>


呼び出す際のCSSの書き方は上記のとおりです。class属性を利用します。

CSSで使われる属性
CSSを使いこなすというのは、どのような属性があるのかを理解することです。参考までに下記に書いて(メモして)いきます。詳細は、CSS辞典などを見ればいいでしょう。

  • color 色
  • background-color 背景色

hoverはおさえておこう
マウスを上におくとフォントや色が変わったりするページがありますよね。あれは、CSSで実現できます。
.selectstyle:hover{color: #ff0000;}

上記は、要素にマウスが来ると色が変わるというものです。











Comments