月份: 2010 年 2 月

在 LESS 看到的：

.rounded_corners {
  -moz-border-radius: 10px;
  -webkit-border-radius: 10px;
  border-radius: 10px;
}

LESS 是一個用 Ruby 寫成的 CSS 產生器，可以讓習慣寫成是的人將 CSS 程式、模組化，在交由 LESS 轉成正式的 CSS 發佈。

例如事先定義：

@my_color: #f00;

之後可以在各個 class 用到：

.top {
   ...
   font-color: @my_color;
}

.main {
   background-color: @my_color;
}

感謝 Jefflen 推薦。

LESS – leaner CSS
http://lesscss.org/

今天遇到的鳥問題：CSS 中真正的 width 要等於 margin + border + padding + 設定的 width。

假設原本的 DIV 設定如下：

.box {
   width: 800px;
}

若要讓原本的區塊寬度不變但要加上 20px 的 padding 必須這樣設定：

.box-padding {
   padding-left: 20px;
   padding-right: 20px;
   width: 760px; /* 800 - 20 - 20 = 760 */
}