前幾天一路從最基本的標籤選擇器、Class、ID等等......
好不容易把「選取對象」的方法搞懂了,終於可以來做一件期待的事——幫這些文字裝扮一下!
想到在photoshop、Illustrator、word當中,常會在「字元面板」裡調整字型、字級大小跟顏色。
而在 CSS 裡面,這一切也是透過一連串的屬性(Properties)來設定的:
color: #e65100;
font-size: 28px;
font-family: "Helvetica Neue", Arial, sans-serif;
text-align: center;
}
稍微筆記了一下認幾個基本樣式屬性:
color(文字顏色)
可以直接寫顏色名稱(如 red),也可以用做設計時最熟悉的 HEX 色碼(如 #e65100)或 RGB。看到這個屬性時對我來說超級親切,完全就是熟悉的色板工具!
font-size(字級大小)
控制文字的大小,最常見是用 px(像素)來設定。
font-family(字型指定)設定文字要套用什麼字型。有趣的是,在網頁上通常會同時指定好幾個字型(備用字型),當使用者的電腦裡沒有第一個字型時,瀏覽器就會自動往後替換。
text-align(文字對齊)控制文字要靠左(left)、置中(center)還是靠右(right)。這跟排版軟體裡的文字對齊按鈕功能一模一樣!
Day 18,筆記了 CSS 文字與基本視覺樣式。