首頁 web前端 css教學 CSS語法手冊(五)顏色與背景屬性

CSS語法手冊(五)顏色與背景屬性

Dec 19, 2016 pm 04:16 PM
背景屬性 顏色

1、color

功能:設定前景或元素的顏色。
數值:使用顏色關鍵字或RGB值。
範例:


文字顏色(關鍵字)

文字顏色(#rrggbb)

文字顏色[rgb(rr,gg,bb)]

文字顏色[rgb(r%,g%) %)]

2、background-color

功能:設定頁面或頁面元素的背景顏色。
數值:
顏色 - 可用顏色名稱或RGB值
transparent - 透明,使頁面背景為預設背景。
範例:


背景顏色

3、background-image

功能:定義背景圖形。
數值:
none - 不用圖形作背景
url - 提供圖形檔案的URL位址
說明:也可以包含background-color屬性以便在找不到圖形時代用
範例:


  、background-repeat

功能:控制圖形背景是否重複排列。

數值:

repeat - 垂直和水平重複,缺省值
repeat-x - 水平重複
repeat-y - 垂直重複
no-repeat - 不重複
說明:這個屬性和background-image 和background-position 屬性一起使用。
範例:


  水平重複排列

5、background-attachment

功能:指定元素的背景是隨元素一起滾動還是固定在頁面某個位置上。

數值:

scroll - 隨元素一起滾動
fixed - 固定
說明:
缺省值是 scroll,這個屬性和 background-image 屬性一起使用。

6、background-position

功能:用於在空間中定位元素背景

數值:

長度 - 相對或絕對單位設定元素框邊緣的起點,並給出單位下的座標。
百分比 - 以百分比表示框邊緣上瀏覽器開始放圖的位置。可以重複這個值也提供垂直和水平起點
垂直位置- 設定垂直方向的起點,關鍵字為top, center, bottom
水平位置- 設定水平方向的起點,關鍵字left, center, right
例如:top left, left top和0% 0% 都表示圖形左上角從元素框左上角開始
範例:


Body {background-image:url(logo.gif); background-position:50% 50%}

這個語句將Body 基本類別設定為背景圖形在頁面上居中顯示。

7、background

功能:簡寫屬性,可以設定所有背景屬性。

數值:

background-attachment
background-color
background-image
background-position
background-repeat
有關上述數值的細節,請參閱各個屬性部分。

 以上就是CSS文法手冊(五)顏色與背景屬性的內容,更多相關內容請關注PHP中文網(www.php.cn)! 

本網站聲明
本文內容由網友自願投稿,版權歸原作者所有。本站不承擔相應的法律責任。如發現涉嫌抄襲或侵權的內容,請聯絡admin@php.cn

熱AI工具

Undresser.AI Undress

Undresser.AI Undress

人工智慧驅動的應用程序,用於創建逼真的裸體照片

AI Clothes Remover

AI Clothes Remover

用於從照片中去除衣服的線上人工智慧工具。

Undress AI Tool

Undress AI Tool

免費脫衣圖片

Clothoff.io

Clothoff.io

AI脫衣器

Video Face Swap

Video Face Swap

使用我們完全免費的人工智慧換臉工具,輕鬆在任何影片中換臉!

熱門文章

<🎜>:泡泡膠模擬器無窮大 - 如何獲取和使用皇家鑰匙
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
北端:融合系統,解釋
3 週前 By 尊渡假赌尊渡假赌尊渡假赌
Mandragora:巫婆樹的耳語 - 如何解鎖抓鉤
3 週前 By 尊渡假赌尊渡假赌尊渡假赌

熱工具

記事本++7.3.1

記事本++7.3.1

好用且免費的程式碼編輯器

SublimeText3漢化版

SublimeText3漢化版

中文版,非常好用

禪工作室 13.0.1

禪工作室 13.0.1

強大的PHP整合開發環境

Dreamweaver CS6

Dreamweaver CS6

視覺化網頁開發工具

SublimeText3 Mac版

SublimeText3 Mac版

神級程式碼編輯軟體(SublimeText3)

熱門話題

Java教學
1665
14
CakePHP 教程
1424
52
Laravel 教程
1322
25
PHP教程
1270
29
C# 教程
1250
24
如何在 Windows 11 上變更標題列顏色? 如何在 Windows 11 上變更標題列顏色? Sep 14, 2023 pm 03:33 PM

預設情況下,Windows11上的標題列顏色取決於您選擇的深色/淺色主題。但是,您可以將其變更為所需的任何顏色。在本指南中,我們將討論三種方法的逐步說明,以更改它並個性化您的桌面體驗,使其具有視覺吸引力。是否可以更改活動和非活動視窗的標題列顏色?是的,您可以使用「設定」套用變更活動視窗的標題列顏色,也可以使用登錄編輯程式變更非活動視窗的標題列顏色。若要了解這些步驟,請前往下一部分。如何在Windows11中變更標題列的顏色? 1.使用「設定」應用程式按+開啟設定視窗。 WindowsI前往“個人化”,然

如何在 Windows 11 上反轉色彩 [使用捷徑] 如何在 Windows 11 上反轉色彩 [使用捷徑] Apr 14, 2023 pm 02:43 PM

使用 Windows 電腦時,可能需要反轉電腦的顏色。這可能是由於個人偏好或顯示驅動程式錯誤造成的。如果你想要反轉 Windows 11 電腦的顏色,本文為你提供了在 Windows 電腦上反轉顏色所需的所有必要步驟。在本文中反轉影像上的顏色是什麼意思?簡單來說,反轉影像的顏色意味著將影像的當前顏色翻轉到色輪上的相反色調。你也可以說這意味著將影像的顏色改為負片。例如,藍色影像將反轉為橙色,黑色變為白色,綠色變為洋紅色等。如何在 Windows 11 上反轉顏色? 1. 使用微軟畫圖按鍵 + ,輸

天然鈦:揭秘iPhone 15 Pro的真實色彩 天然鈦:揭秘iPhone 15 Pro的真實色彩 Sep 18, 2023 pm 02:13 PM

隨著一年一度的Wanderlust活動的結束,蘋果終於平息了長達數月的關於其iPhone15陣容的謠言和猜測。正如預期的那樣,其2023年的旗艦“Pro”型號在原始動力以及新的“鈦”設計和美學方面與眾不同。以下是新款iPhone15Pro型號的不同顏色,並確定「天然鈦」變體的真實顏色和色調。蘋果手機15專業版顏色蘋果選擇了5級鈦合金作為最新iPhone15Pro型號的材料設計。 iPhone15Pro上使用的鈦合金以其強度重量比而聞名,不僅使其更加耐用和輕便,而且還賦予該設備優雅的「刷子」質地,這

win10電腦護眼顏色怎麼設定應用的詳細教學 win10電腦護眼顏色怎麼設定應用的詳細教學 Jul 08, 2023 am 10:46 AM

對辦公一族來說,面對電腦辦公就是一整天,多數軟體背景色都是純白,看的時間長了,眼睛就會感到乾澀,難受。其實,我們可以自訂調整視窗護眼色,網路上介紹的方法操作起來比較麻煩,本文小編和大家分享一招win10調整視窗護眼色的方法。快來看看電腦護眼模式怎麼設定的方法吧。 1.先在鍵盤上按下組合鍵【win】+【R】開啟運行視窗輸入【regedit】點選確定開啟。 2.然後依序展開登錄資料夾:【\HKEY_CURRENT_USER\ControlPanel\Colors】3、然後在Colors資料夾中

如何變更Windows 10工作列的顏色 如何變更Windows 10工作列的顏色 Jan 01, 2024 pm 09:05 PM

win10工作列顏色修改起來非常簡單,但是很多用戶發現設定不了,其實非常的簡單,只要在電腦的個人化裡選擇自己喜愛的顏色就可以了,要是改變不了顏色的注意詳細的設定哦。 win10工作列顏色怎麼改第一步:右鍵桌面-點選個人化第二步:顏色區域自訂第三步:選擇喜歡的顏色PS:如果你無法改變顏色,可以點選顏色->選擇顏色->自訂->預設windows模式,選擇深色即可。

vivo全新X100系列記憶體、色彩曝光:全系12+256GB起步 vivo全新X100系列記憶體、色彩曝光:全系12+256GB起步 May 06, 2024 pm 03:58 PM

5月6日消息,今天vivo官方宣布,全新的vivoX100系列將在5月13日19:00正式發布。據了解,此次發表會預計將發表vivoX100s、vivoX100sPro、vivoX100Ultra三款機型,以及vivo自研影像品牌BlueImage藍圖影像技術。數位部落客「數位閒聊站」今天也放出了這三款機型的官方渲染圖、內存規格及配色等,其中X100s採用了直屏設計,而X100sPro和X100Ultra則是曲屏設計。部落客透露,vivoX100s共有黑、鈦、青、白四種配色,記憶體規格

WPS文件表格顏色怎麼設定你知道嗎 WPS文件表格顏色怎麼設定你知道嗎 Mar 20, 2024 am 08:19 AM

我們在看到別人的WPS文件中表格顏色做出來的效果五顏六色,十分美觀;而自己只有單調的黑色。如果過給表格填充顏色,我相信很多同學都會。但是,如果要在WPS文件中國設置表格的顏色的話,一定有不少同學會覺得燒腦!今天,我們來學習一下關於如何設定WPS文件表格的顏色。我整理了一份文檔,希望對大家有幫助。步驟如下:1、我們需要在WPS文件中繪製一個表格,在要修改線條顏色的表格中點選滑鼠右鍵。 2、接著,用滑鼠在表格上點選【滑鼠右鍵】;在彈出的選單中,我們找到【邊框和底紋】。 3.此時,會打開【邊框和底紋】對

如何設定Debian 11 Xfce終端的遊標顏色? 如何設定Debian 11 Xfce終端的遊標顏色? Jan 03, 2024 pm 02:36 PM

Xfce是什麼? Xfce是一個自由軟體,運作在類別Unix作業系統(如Linux、FreeBSD和Solaris)上,提供輕量級桌面環境。 Debian11Xfce終端如何調遊標顏色?隨小編一起看一下具體操作吧。點選【編輯】-【首選項】。切換到【顏色】選項卡。勾選自訂【遊標顏色】,點選右側顏色選擇按鈕。打開調色板後,點擊選擇要設定的遊標顏色即可。

See all articles