Web 制作のことを中心に、ちょっとした Tips などを掲載しています。「自分用メモ」が基本スタンス。

btmup Blog

CSS

CSS のプロパティの書き順をちゃんと決めることにした。

投稿日:

「今さらかよ」という声が聞こえてきそうですが。

前々から「いつかやろう」「これが終わったらしよう」と思いつつ早幾月。
ようやく踏ん切りが付きました。
ので、自分はこういう順番で書きますよー、という宣言的な意味を込めてエントリー。

今までは特にルールもなく、「組んでいくときに追加した順」みたいな感じでした。
もちろん気が付く範囲では調整はしてたので、何となくは統一されてましたが。
他の人からすると恐ろしく読みにくいことになってたんだろうなー、と推測します。
(でも社内で CSS 使えるの僕だけなので他の人が見ることはまぁ無いんですけどね(っていうかそういう状況を何とかするのが先のような気がしないでもなjっs;ぁsdf;jふぁsj))

さて、そんなこんなで今までは何事も無くやってきたのですが、さすがにずっとそのままではまずかろう、という漠然とした動機で決めることにします。
といいつつ、自分で決めた順番ではなくて、基本的には Mozilla の順番を踏襲。
あとは好みとか使い勝手とかで違和感があれば、追々ちょっとずつ変えていこうと思います。

ザックリと調べてみたところによると「 Cascading Style Sheets, Level 2」をベースにしているという人も結構居るようなのですが、プロパティの数が恐ろしく多いので今回はスルーで。

とりあえず、Mozilla からの引用をザッとリストアップ。

/* Suggested order:
* display
* list-style
* position
* float
* clear
* width
* height
* margin
* padding
* border
* background
* color
* font
* text-decoration
* text-align
* vertical-align
* white-space
* other text
* content
*/

プリントアウトして、モニタにでも貼り付けときます。

参考サイト




-CSS
-,

Copyright© btmup Blog , 2024 All Rights Reserved Powered by AFFINGER5.