Blog

※ブログ移転しました。 → hamashun.me

じゃあ俺もCSSの書き方を書くよ!

自分のプロパティの書き順とか|CSS HappyLifeとかRedLine Magazine : 自分もプロパティの書き順とかとかを読んだので僕も書いてみます。

プロパティの降順

  1. clear
  2. float
  3. position
  4. display
  5. width
  6. height
  7. min-height
  8. margin
  9. padding
  10. border
  11. あとは概ねアルファベット順

わりとアバウトだった件。 テンションによって微妙に入れ替わってたりしそう。

CSSのコードの書き方

<div>
  <ul>
    <li><a href="/">hoge</a></li>
    <li><a href="/">huga</a></li>
    <li><a href="/">foo</a></li>
    <li><a href="/">bar</a></li>
  </ul>
</div>

例えばこんなHTMLだったら、

div {
  width: 500px;
}

  div ul {
    margin-left: 30px;
  }

    div ul li {
      list-style-type: none;
    }

こんな風にインデントしたりします。
ただ、「必ずする」としてしまうとインデントしすぎたり色々面倒なので、適宜インデント、くらいの空気感。

ショートハンドは、

div {
  background: skyblue url(hoge.png) no-repeat left top;
  border: solid 1px lime;
}

など。

その他

あとは目次や見出し的なコメントを入れたりしてます。
エディタはローカルがezhtmlで、サーバがvimです。 vimの設定は殆どさわってないです。
": ;"とか"{ }"とかをタイピングするのが面倒なので、簡単なAutoHotKeyスクリプトを書いて簡略化しています。

TracBack

Reference Entry:  じゃあ俺もCSSの書き方を書くよ!:

londoner25.net » いい機会なのでガイドラインみたいなのをつくる
今まで何度も自分の中でルールを決めようと思いながら実行できてなかった。CSSプロパティ順エントリーチェーンができてたので便乗して作ってみる。 ...
TracBack Time:  2009年03月04日 10:09

Contribution Form

Blog Search
Search
Recent Entry
Category
Monthly Archive