CSS文字、背景、表格、display
文字
屬性 |
說明 |
color |
設定文字顏色 |
text-align |
設定文字對齊:right、center、left |
font-size |
設定文字大小 |
font-weight |
設定文字加粗 |
font-family |
設定字體 |
text-decoration |
設定文字裝飾:underline、none、overline、line-through |
背景
屬性 |
說明 |
background |
將背景屬性一次設定。 |
background-color |
背景顏色 |
background-image |
背景圖片 |
background-position |
背景圖片位置:center、top、bottom、right、left |
background-repeat |
背景圖片是否重複:repeat、repeat-x、repeat-y、no-repeat |
background-attachment |
背景圖片是否固定或滾動:scroll、fixed |
background-image
body {background-image: url(/assets/bg.png);}
background-repeat
body {
background-image: url(/assets/bg.png);
background-repeat: no-repeat;
}
background-position
body {
background-image: url(/assets/bg.png);
background-repeat: no-repeat;
background-position:center;
}
也可以只用百分比值或長度值。
body {
background-image: url(/assets/bg.png);
background-repeat: no-repeat;
background-position:50px 100px;
}
background-attachment
body {
background-image: url(/assets/bg.png);
background-repeat: no-repeat;
background-attachment:fixed
}
表格
邊框:border
table, td, th
{
border:1px solid green;
}
display
每個 HTML 元素都有一個預設的 display 值,大部分元素的 display 屬性,預設值通常是 block 或 inline 其中一個。
屬性 |
說明 |
none |
此元素不會被顯示。 |
block |
此元素將顯示為區塊元素,且前後會帶有換行。 |
inline |
預設。行内元素。 |
inline-block |
行内區塊元素。 |
list-item |
此元素會作為列表顯示。 |