CSS樣式性質表

背景樣式

• * background-image ---一般背景圖案
  • URL：即圖檔的位址，可以使用JPG、GIF、PNG三種圖格式。
    範例：{background-image:url(ball.gif)}
     
• * background-repeat ---重複顯示背景圖案
  • repeat：預設值，重複顯示背景至全螢幕。
  • repeat-x：水平方向重複顯示背景，可做為分隔線，或橫向邊條之設計。
  • repeat-y：垂直方向重複顯示背景，可做為縱向邊條設計。
  • no-repeat：不重複背景。
    範例：{background-repeat:repeat-y}
     
• * background-attachment ---捲動或固定的背景圖案
  • fixed：背景圖案不跟捲軸一起捲動，即背景圖案固定不動。
  • scroll：背景圖案跟捲軸一起捲動，預設值。
    範例：{background-attachment:fixed}
     
• * background-position ---背景圖案的位置
  • 長度：(X Y)，用長度單位來表示座標。(0 0)表示是區域元件左上角原點。 (12pt 34pt)，12pt 表示距原點之水平距離為12pt。
  • 百分比：(X% Y%)表示座標。(0% 0%)表示區域元件左上角原點。 (20% 40%)，20% 表示距原點的水平距離為區塊元件水平長度的20%。
  • 關鍵字：可把水平設定值和垂直設定值組合。
    ◆top：正上方，垂直位移為0%，(50% 0%)。
    ◆bottom：正下方，垂直位移為100%，(50% 100%)。
    ◆center：正中間，垂直和水平位移為50%，(50% 50%)。
    ◆left：正左邊，水平位移為0%，(0% 50%)。
    ◆right：正右邊，水平位移為100%，(100% 50%)。
    ◆bottom right：右下角，(100% 100%)。
    範例：{background-position:(12pt 34pt)}