tft每日頭條

 > 圖文

 > css樣式基礎與整體總結

css樣式基礎與整體總結

圖文 更新时间:2025-01-24 22:48:15
一、CSS背景屬性1.背景顔色（background-color）

屬性值：transparent(透明的)或color(顔色)

css樣式基礎與整體總結（CSS基礎知識七CSS背景）1

css樣式基礎與整體總結（CSS基礎知識七CSS背景）2

2.背景圖片（background-image）

屬性值：none(沒有)或url(使用絕對或相對地址指定背景圖像)

優點：非常便于控制位置（精靈圖也是一種運用場景）

css樣式基礎與整體總結（CSS基礎知識七CSS背景）3

css樣式基礎與整體總結（CSS基礎知識七CSS背景）4

3.背景平鋪（background-repeat）

屬性值：repeat|no-repeat|repeat-x|repeat-y

背景圖片會壓住背景顔色

css樣式基礎與整體總結（CSS基礎知識七CSS背景）5

css樣式基礎與整體總結（CSS基礎知識七CSS背景）6

4.背景圖片位置（background-position）

background-position：x y;

  1. x坐标和y坐标可使用方位名詞或精确單位
  2. 方位名詞a. x可為left | center | right ,y可為top | center | bottomb. top left 和 left top 效果一緻（與順序無關）c. 若隻指定一個方位名詞，另一個值忽略，則第二個值默認為居中對齊
  3. 精确單位a.先x坐标後y坐标b.若隻指定一個值，則為x,另一個值為垂直居中
  4. 混合單位：若混合使用，第一個值為水平x,第二個值為垂直y
5.背景圖片固定（background-attachment）

屬性值：scroll（随内容滾動）| fixed（背景固定）

css樣式基礎與整體總結（CSS基礎知識七CSS背景）7

css樣式基礎與整體總結（CSS基礎知識七CSS背景）8

6.背景複合寫法（background）

background：背景顔色 背景圖片地址 背景平鋪 背景圖像滾動 背景圖片位置

7.背景色半透明（CSS3提供了背景顔色半透明的效果）
  • background：rgba(0,0,0,.3);
  • red green blue alpha(透明度 範圍0~1）
  • 習慣把0.3的0省掉
  • 背景半透明是指盒子背景半透明，盒子裡面的内容不受影響
,

更多精彩资讯请关注tft每日頭條，我们将持续为您更新最新资讯!
查看全部
上一页 下一页
單機冒險手機遊戲大全
彈彈堂手遊60級武器...

相关圖文资讯推荐

热门圖文资讯推荐

网友关注

關于
條款和條件 隱私政策 Cookie 設置
服務
登陸 注冊 聯系我們
tft每日頭條 美食 生活 職場 母嬰 時尚 科技 汽車
友情鏈接
zpostcode Recruit weather mreligion Yellowpages sport constellation shopping name game directory literature Word tour furnish Lottery tftnews lyrics News digital car dir Edu Finance
Copyright 2023-2025 - www.tftnews.com All Rights Reserved