CSS學習筆記

標籤：http   color   os   使用   io   ar   div   cti   html   

1、HTML 和 CSS 顏色規範中定義了 147 中顏色名（17 種標準顏色加 130 種其他顏色）。
http://www.w3school.com.cn/cssref/css_colornames.asp （link裡面列出了這些顏色）

2、css的尺寸（http://www.baidu.com/s?wd=%E8%8B%B1%E5%AF%B8 可以查查）：
單位 描述
% 百分比
in 英寸
cm 厘米
mm 毫米
em
1em 等於當前的字型尺寸。
2em 等於當前字型尺寸的兩倍。
例如，如果某元素以 12pt 顯示，那麼 2em 是24pt。
在 CSS 中，em 是非常有用的單位，因為它可以自動適應使用者所使用的字型。
ex 一個 ex 是一個字型的 x-height。 (x-height 通常是字型尺寸的一半。)
pt 磅 (1 pt 等於 1/72 英寸)
pc 12 點活字 (1 pc 等於 12 點)
px 像素 (電腦螢幕上的一個點)

3、css裡面的屬性（http://www.w3school.com.cn/cssref/index.asp#）
進階使用會用到的屬性：
@keyframes 規定動畫。
animation 所有動畫屬性的簡寫屬性，除了 animation-play-state 屬性。
animation-name 規定 @keyframes 動畫的名稱。
animation-duration 規定動畫完成一個周期所花費的秒或毫秒。
animation-timing-function 規定動畫的速度曲線。
animation-delay 規定動畫何時開始。
animation-iteration-count 規定動畫被播放的次數。
animation-direction 規定動畫是否在下一周期逆向地播放。
animation-play-state 規定動畫是否正在運行或暫停。
animation-fill-mode 規定對象動畫時間之外的狀態。

因為瀏覽器的不同，display參數不同
div
{
width:350px;
height:100px;
border:1px solid black;

/ Firefox /
display:-moz-box;
-moz-box-orient:horizontal;

/ Safari、Opera 以及 Chrome /
display:-webkit-box;
-webkit-box-orient:horizontal;

/ W3C /
display:box;
box-orient:horizontal;
}

在不同裝置上顯示不同：
@media screen
{
p.test {font-family:verdana,sans-serif; font-size:14px}
}

@media print
{
p.test {font-family:times,serif; font-size:10px}
}

@media screen,print
{
p.test {font-weight:bold}
}

CSS學習筆記