首页
/
每日頭條
/
圖文
/
css樣式基礎與整體總結
css樣式基礎與整體總結
更新时间:2026-04-27 02:43:31
一、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省掉
  • 背景半透明是指盒子背景半透明,盒子裡面的内容不受影響
,
Comments
Welcome to tft每日頭條 comments! Please keep conversations courteous and on-topic. To fosterproductive and respectful conversations, you may see comments from our Community Managers.
Sign up to post
Sort by
Show More Comments
推荐阅读
隻狼前期擁有全部技能mod
隻狼前期擁有全部技能mod
隻狼前期擁有全部技能mod?近日《隻狼》的《死或生》性感女忍者MOD推出之後,在遊戲中我們再也不用整天受着“死”字的氣的同時,還得總是盯着一個老爺們看了尤其是這款MOD還将人物的聲音也替換成了女聲,極大地強化了廣大玩家們的體驗,獲得點贊無數...
2026-04-27
春節送禮佳品大合集
春節送禮佳品大合集
春節過年的時候,送禮環節必不可少。我曾跟老爸商量能不能給親戚們建個群,在群裡發紅包算了。其實過年買的禮盒都挺不上算的,又貴又不實用。老爸義正言辭的批了我一頓。話說,大家過年都送啥禮品呢?一、營營養,保健品。首先是家裡長輩,送禮範圍一般是牛奶...
2026-04-27
斷聯的人很久了突然又聯系
斷聯的人很久了突然又聯系
社會學家霍曼斯曾說:“任何人際關系,其本質上就是交換關系。”不管我們遇見誰,不管我們跟誰走到一起,我們都是在進行各種交換活動,也許是拿真心交換真心,也許是拿金錢交換權力,也許是拿權力交換服務,等等。一旦無法從對方身上獲得自己想要的東西,我們...
2026-04-27
公牛集團上市價值
公牛集團上市價值
公牛集團上市價值?本周九個新股同時進行申購,你是不是手忙腳亂,但是衆多新股中最引人注意的還是公牛集團申購,其公牛集團發行價格是59.45元/股,可以說是近兩年非科創闆新股的發行價格最高新股了,成為2016年新股信用申購制度實施以來,發行價第...
2026-04-27
居安思危才會慎行緻遠
居安思危才會慎行緻遠
原創丨版權:書報文摘(微信公衆号id:shubaowenzhai)未經授權請勿進行任何形式的轉載01上個月,朋友所在的公司倒閉,公司中很多人都慌了,發愁習慣了“養老式”工作,沒有任何過硬技能的自己,要怎麼找到下一份工作。當很多人都在為未來擔...
2026-04-27
Copyright 2023-2026 - www.tftnews.com All Rights Reserved