跳到主要內容
  • 字級
:::|

4.3:CS2040300 任何已知CSS樣式規則產生的前景、背景色彩配置,其對比值均不會低於3:1

檢測碼

CS2040300

訊息

任何已知CSS樣式規則產生的前景、背景色彩配置,其對比值均不會低於3:1

英文訊息

G148: Not specifying background color, not specifying text color, and not using technology features that change those defaults

檢測規則

if CSS樣式規則產生的前景和背景色彩配置比值高於3:1,通過檢測,否則檢測失敗。

規則說明

只要CSS樣式規則產生的前景和背景色彩配置比值不低於3:1,則通過檢測。

原始碼範例

<style type="text/css">

#bcolor{

  color:#ffffff;background-color:#330000

}

</style>

<p id="bcolor">中部地區今日天氣概況為午後有局部雷陣雨......</p>

說明

html:

<p>標籤中id呼叫CSS中#名稱相符的集合(此為#bcolor)

CSS:

設定前景顏色(color)與背景顏色(background-color)

 

註解:

1.如果無法確認對比值充分(文字及影像文字至少4.5:1,大尺寸文字及影像文字至少3:1),則不要指定背景色彩,

也不要指定前景色彩,而且不要使用會變更這些預設值的科技功能

2.因前景、背景狀況過多,例如:文字顏色與背景顏色、方塊內文字顏色與方塊顏色、方塊顏色與背景顏色…等,所以無法以機器檢測,只能以手動檢測。

3.計算前景背景顏色比值,公式:100 x (((R1-R2)的平方 + (G1-G2)的平方 + (B1-B2) 的平方)/3)的0.5次方/255。

4.以上面範例來說,背景色彩配置為深褐色(顏色代碼#330000,RBG值為51/0/0),前景色為白色(顏色代碼#ffffff,RBG值為255/255/255),上述前景色和背景色彩配置的對比值:代入上列公式得到前景背景顏色對比值=93.80831519646858,不低於3。