當(dāng)前位置:首頁(yè) >  站長(zhǎng) >  建站經(jīng)驗(yàn) >  正文

Css代碼中color屬性的幾種常見用法及區(qū)別

 2020-02-09 11:01  來(lái)源: A5企業(yè)專欄   我來(lái)投稿 撤稿糾錯(cuò)

  域名預(yù)訂/競(jìng)價(jià),好“米”不錯(cuò)過(guò)

  大家在制作網(wǎng)站和編寫css代碼的時(shí)候,經(jīng)常都會(huì)使用到color屬性,這也是一個(gè)網(wǎng)頁(yè)在制作中非常常見的屬性,但是,就是這樣一個(gè)最常用的屬性也有多種表達(dá)方法,可以在不同的時(shí)候派上用場(chǎng)。

  一、十六進(jìn)制代碼指定顏色

  這是在使用color屬性是最常用的方法之一,這種方法的優(yōu)點(diǎn)在于對(duì)于顏色的選擇十分的精確,并且可以選擇的顏色種類也非常多,因?yàn)樗梢酝ㄟ^(guò)代碼來(lái)實(shí)現(xiàn)顏色的微調(diào)。比如,在十六進(jìn)制代碼中,純藍(lán)色的代碼為color:#0000FF;當(dāng)然,需要注意的是,使用這種代碼一定要在顏色代碼前添加#符號(hào),如果忘記的話是沒有效果的。

  二、直接用顏色的英文名稱來(lái)選擇顏色

  這個(gè)方法與第一種方法一樣,都是在使用color屬性的過(guò)程中最為常用的方法之一。它的特點(diǎn)是十分簡(jiǎn)單,只需要記住顏色的英文名字就可以使用了,如紅色的代碼為color:red;黃色的代碼為color:yellow;而藍(lán)色的代碼就是color:blue;但是,方便使用是相對(duì)的,在使用較為常見或是純色的時(shí)候,使用這種方式非常簡(jiǎn)單,但如果是一些具有變化的顏色時(shí),它就會(huì)讓一些人感到抓狂了,因?yàn)槿绻皇褂眠@一種方式的話,就意味著你要記住每一種顏色的英文名字且不能混淆。同時(shí),這種方式選擇的顏色并不是十分精確,所以就導(dǎo)致了如果使用不同的瀏覽器打開同一個(gè)網(wǎng)站,看到的顏色卻是有所偏差的,這就無(wú)法體現(xiàn)出完整的設(shè)計(jì)效果了。

  三、使用RGB:rgb模式進(jìn)行顏色的選擇

  如果是學(xué)過(guò)設(shè)計(jì)的人,那么對(duì)于RGB一定非常的熟悉,因?yàn)檫@是在設(shè)計(jì)的過(guò)程中使用的最多的選擇顏色的方式之一,但是在css代碼的color屬性中,這種方式卻并不是那么常用,但這也是一個(gè)能夠非常精確的選取顏色的辦法。

  RGB即光的三原色:紅色、綠色、藍(lán)色。讓這三種顏色以不同的比例進(jìn)行調(diào)和,就可以展現(xiàn)出各種各樣的顏色,所以只要在css中設(shè)置好這三種顏色的比例,也可以非常精確的選擇出自己想要的顏色。但是由于使用這個(gè)辦法要對(duì)每一種顏色的比例非常了解,所以使用起來(lái)具有一定的難度,也需要反復(fù)調(diào)試才能做到。在這種模式中,每一個(gè)顏色分為255份,舉一個(gè)簡(jiǎn)單的例子,如果想要選擇純紅色,只需輸入color:rgb(255,0,0);即可。

  四、進(jìn)階的RGBA:rgba方法

  這種顏色選擇方法是基于RGB:rgb方法的一個(gè)升級(jí)版,在后面加入的變量是alpha,也就是透明度。我們都知道,在網(wǎng)站的制作中,常常會(huì)產(chǎn)生對(duì)于一些半透明顏色的需求,那么此時(shí),就需要用到alpha這個(gè)屬性了,因?yàn)檫@個(gè)屬性控制的就是顏色的透明度。Alpha屬性的值介于0到1之間,即如果alpha=1,那么顏色就是完全不透明的;相反,如果alpha=0,那么顏色就是完全透明的,所以如果需要一個(gè)半透明的顏色,將alpha的值設(shè)置為0.5即可,這樣就可以讓站長(zhǎng)根據(jù)自己的需求來(lái)選擇顏色的透明度了。

  顏色的選擇方法有很多,它們每一種都具有自身獨(dú)特的特點(diǎn),在建站時(shí),也不應(yīng)該拘泥于使用同一種方法。如果需要純色,那么當(dāng)然可以選擇第二種最簡(jiǎn)單的方法,但如果需要一些復(fù)雜的顏色,那么顯然第一種、第三種則是更好的選擇。而如果對(duì)顏色的透明度有所要求,那么自然就要運(yùn)用第四種方法。如果能夠?qū)⑦@四種方法都掌握的話,那么就足以應(yīng)對(duì)網(wǎng)站建設(shè)中關(guān)于顏色設(shè)置的問(wèn)題了。作者: https://www.haotuiwang.cn/ 平頭哥SEO,原創(chuàng)不易,轉(zhuǎn)載時(shí)必須以鏈接形式注明作者和原始出處及本聲明。

申請(qǐng)創(chuàng)業(yè)報(bào)道,分享創(chuàng)業(yè)好點(diǎn)子。點(diǎn)擊此處,共同探討創(chuàng)業(yè)新機(jī)遇!

相關(guān)文章

  • 外貿(mào)商城網(wǎng)站建設(shè)哪家好 三大知名外貿(mào)商城綜合對(duì)比

    隨著國(guó)際化貿(mào)易的融合以及國(guó)家對(duì)外貿(mào)的支持,外貿(mào)電商越來(lái)越火,讓商品出海已經(jīng)是不少中大型企業(yè)的戰(zhàn)略性布局。雖然自建站會(huì)比SaaS有著靈活擴(kuò)展的優(yōu)勢(shì),但如何解決商品出海橫跨在企業(yè)和用戶眼前的語(yǔ)言難題,是不少企業(yè)需要考慮的一個(gè)核心點(diǎn)。

    標(biāo)簽:
    網(wǎng)站建設(shè)
  • 做管理對(duì)員工的要求就是,干活必須帶腦子

    我自己做管理這么多年,從來(lái)不鼓勵(lì)員工埋頭苦干、必須加班。因?yàn)檫@些根本沒有卵用,純粹都是形式主義。我對(duì)員工的要求之一,就是干活必須帶腦子。但就是這么一個(gè)簡(jiǎn)單要求,相當(dāng)一部分人,根本做不到。

  • 網(wǎng)站建設(shè)常用的建站系統(tǒng)推薦

    網(wǎng)站建設(shè)已經(jīng)很是普及的事情,稍微注重網(wǎng)絡(luò)宣傳的企業(yè)或單位都會(huì)有自己的網(wǎng)站,網(wǎng)站建設(shè)是一個(gè)比較復(fù)雜的過(guò)程,特別是對(duì)于非專業(yè)的人員來(lái)說(shuō),所以很多新手有網(wǎng)站建設(shè)需求,最先想到的是找本地一家網(wǎng)站建設(shè)公司來(lái)承建

    標(biāo)簽:
    網(wǎng)站建設(shè)
  • 自動(dòng)化建站優(yōu)化+賣站,看起來(lái)是個(gè)好生意

    這幾天在站長(zhǎng)論壇看到有人交流自動(dòng)化建站然后SEO優(yōu)化,最后在已3K+左右的價(jià)格賣出??催@確實(shí)讓人熱血沸騰,想馬上開始行動(dòng)起來(lái),其實(shí)我個(gè)人覺得這里面還是有很多難點(diǎn)的。

    標(biāo)簽:
    網(wǎng)站建設(shè)
  • 網(wǎng)站建設(shè)過(guò)程中容易被忽略的元素是什么?

    網(wǎng)站從建設(shè)到真正運(yùn)營(yíng),會(huì)忽略很多元素。其實(shí)一個(gè)網(wǎng)站能否達(dá)到預(yù)期的效果,網(wǎng)站建設(shè)與網(wǎng)站優(yōu)化做好的同時(shí),很關(guān)鍵一點(diǎn),客戶自身的問(wèn)題。比如我們幫企業(yè)建設(shè)網(wǎng)站,網(wǎng)站提供的主要服務(wù)還是掌握在客戶手上。下面筆者談?wù)劸W(wǎng)站建設(shè)過(guò)程中容易被忽略的元素。詳情看下文

    標(biāo)簽:
    網(wǎng)站建設(shè)

熱門排行

信息推薦