溫馨提示×

溫馨提示×

您好,登錄后才能下訂單哦!

密碼登錄×
登錄注冊×
其他方式登錄
點擊 登錄注冊 即表示同意《億速云用戶服務(wù)條款》

html設(shè)置背景顏色的方法有哪些

發(fā)布時間:2020-08-28 14:12:57 來源:億速云 閱讀:528 作者:小新 欄目:web開發(fā)

這篇文章主要介紹了html設(shè)置背景顏色的方法有哪些,具有一定借鑒價值,需要的朋友可以參考下。希望大家閱讀完這篇文章后大有收獲。下面讓小編帶著大家一起了解一下。

一:設(shè)置背景顏色

1.準(zhǔn)備編輯HTML

首先確定要使用的背景顏色,HTML顏色由每個代碼決定。在計算機(jī)的Web瀏覽器中訪問http://www.php.cn/html/html-colornames.html,就能查看所有顏色的代碼,并且在“HEX”部分中選擇要使用的基色。

2.使用Notepad ++或Notepad打開HTML文件,并且把頁面的所有樣式信息(包括背景顏色)添加進(jìn)來。將“background-color”屬性添加到“body”元素。background-color要在body括號之間輸入,如下:

<body bgcolor="red">背景紅色

或者

body { 
    background-color:red
}

html設(shè)置背景顏色的方法有哪些

3.您可以使用“background-color”來定義其他元素的背景,例如標(biāo)題,段落等。例如,要將背景顏色應(yīng)用于主標(biāo)題(<h2>)或段落(<p>)。

二:創(chuàng)建漸變背景

1.制作漸變時,我們需要兩條信息起點和角度,以及漸變之間過渡的顏色。您可以選擇多種顏色以使?jié)u變在所有顏色之間移動,并且可以設(shè)置漸變的方向或角度。

屬性:

背景:線性梯度(方向 /角度,顏色1 ,顏色2 , 顏色3 ,等);

2.制作垂直漸變的時候,如果未指定方向,則漸變將從上到下要創(chuàng)建漸變,要在<style></style>標(biāo)記之間添加以下代碼:

html { 
    min-height : 100%;  
} 
body { 
    background : -webkit-linear-gradient(left ,#93B874 ,#C9DCB9 );  
    background : -o-linear-gradient(right,#93B874 ,#C9DCB9 ); 
    background : -moz-linear-gradient(right,#93B874 ,#C9DCB9 );  
    背景:線性梯度(到右側(cè),#93B874 ,#C9DCB9 ); 
    background-color :#93B874 ;  
}

當(dāng)然也可以向漸變添加方向以更改顏色偏移的顯示方式,您不僅可以添加兩種以上的顏色,還可以在每種顏色之后添加一個百分比。也可以設(shè)置每個顏色段所需的間距,為您的顏色添加透明度,使用相同的顏色從顏色淡化為空。也可以使用該rgba()函數(shù)來定義顏色,結(jié)束值決定透明度:0實體和1透明。

感謝你能夠認(rèn)真閱讀完這篇文章,希望小編分享html設(shè)置背景顏色的方法有哪些內(nèi)容對大家有幫助,同時也希望大家多多支持億速云,關(guān)注億速云行業(yè)資訊頻道,遇到問題就找億速云,詳細(xì)的解決方法等著你來學(xué)習(xí)!

向AI問一下細(xì)節(jié)

免責(zé)聲明:本站發(fā)布的內(nèi)容(圖片、視頻和文字)以原創(chuàng)、轉(zhuǎn)載和分享為主,文章觀點不代表本網(wǎng)站立場,如果涉及侵權(quán)請聯(lián)系站長郵箱:is@yisu.com進(jìn)行舉報,并提供相關(guān)證據(jù),一經(jīng)查實,將立刻刪除涉嫌侵權(quán)內(nèi)容。

AI