close

文字反白的做法很多,咱們就用一個簡單的技巧,先將文字用 <span> 標籤包起來,然後加上 background 的 color 屬性,來修改文字背景顏色,看起來就像是反白的效果囉!

假設我們的範例語法如下方這樣

<span>測試文字</span>

但是光這樣當然還不夠,必須加上 css style 的 background 屬性,所以重新寫過

<span style="background-color:blue;color:white;">測試文字</span>

呈現結果就像這樣


測試文字

還蠻簡單的對吧!

語法中的 background-color:blue 意思就是背景顏色為藍色,至於 color:white; 就是文字顏色為白色。

延伸學習

CSS background 背景屬性介紹
CSS background-color 屬性與用法介紹

這兩篇講解都還蠻詳細的,第一個是背景的概括介紹,第二個則是背景顏色的設定技巧。

arrow
arrow
    全站熱搜
    創作者介紹
    創作者 adbpix 的頭像
    adbpix

    adbpix生活部落格

    adbpix 發表在 痞客邦 留言(0) 人氣()