CSS基礎

ここではCSSの基本的なことについて書いていきたいと思います。CSSはカスケード・スタイル・シートの略で、拡張子は.cssです。これはメモ帳などでも可能なのですが、CSS対応ソフトだともっと簡単に出来ます。XHTMLでも書きましたが個人的にはCSSエディタ機能があるKompozerを使ってます。よく分からない方のために一応書いておきますが、htmlファイルにCSSを読み込ませたいときは、<head>～<head>に

と書き加えて読み込ませます（拡張子は.cssです）。

基本的なcssの書き方も一応書いておきます。

要素名 { プロパティ : 値 ; }

※要素名はh1,p,img,idセレクタ名,classセレクタ名,等の事です。
※プロパティと値についてはこのページの項目の最後にあります。

とりあえず詳しい事はわからなくてもホームページは制作できるので難しい事は省きたいと思います。

cssリセットの簡単な説明

CSSリセットとは、webブラウザが標準で備えているCSSをリセットする事によって、ブラウザごとの文字大きさの違いや表示のずれなどの問題を最小限にとどめます。

ユニバーサルセレクタ

この方法では意図しない要素までリセットしてしまう、新しいプロパティには適用されないなどの理由から現在ではあまり使われていないようですが一応

*{
margin: 0px;
padding: 0px;
font-size: 100%;
font-weight: nomal;
font-style: nomal;
line-height: 1;
text-decoration: none;
border: none;
list-style-type: none;
}

要素ごと

この方法は各要素ごとに各ブラウザの標準のCSSをリセットします。とりあえず基本的なものを書きましたが、使用する要素だけで結構です。

body,div,dl,dt,dd,ul,li,ol,h1,h2,h3,h4,h5,h6,pre,form,fieldset,input,textarea,p,th,td{
margin: 0;
padding: 0;
}
h1,h2,h3,h4,h5,h6{
font-size: 100%;
font-weight: nomal;
}
fieldset,img{
border: 0;
}
ol,li{
list-style-type: none;
}
address,caption,code,em,cite,dfn,strong,th,var{
font-style: nomal;
font-weight: nomal;
}

cssプロパティ

cssで使用するプロパティについてまとめました。基本的なこと、良く使うものに対してだけですが参考になればと思います。