跳到主要內容
:::|

4.8:CS3040801 需有CSS樣式規則使用百分比數值或相對長度單位來設定欄寬,且最大欄寬不得超過80個字母(中日韓語系的40個文字)

檢測碼

CS3040801

訊息

需有CSS樣式規則使用百分比數值或相對長度單位來設定欄寬,且最大欄寬不得超過80個字母(中日韓語系的40個文字)

英文訊息

C20: Using relative measurements to set column widths so that lines can average 80 characters or less when the browser is resized

C24: Using percentage values in CSS for container sizes

檢測規則

如果設定欄寬的標籤存在且對應的CSS內的width屬性值不為空並以相對尺寸為單位或max-width屬性值不超過80個字母的寬度或以相對尺寸為單位,通過檢測,否則檢測失敗。

規則說明

若設定欄寬的標籤存在且對應的CSS內的width屬性值不為空並以相對尺寸為單位或max-width屬性值不超過80個字母的寬度或以相對尺寸為單位,則通過檢測。

原始碼範例

[Example 1]

XHTML component的code部分:

<div id="main_content">

  <p>今天天氣真好</p>

</div>

 

CSS component的code部分:

#main_content {max-width: 70em}

--------------------------------------------------------------------

[Example 2]

XHTML component的code部分:

<div id="main_content">

  <p>今天天氣真好</p>

</div>

 

CSS component的code部分:

#main_content {width: 90%}

說明

[Example 1] 範例說明:

XHTML component的code部分:

<div>是用來設定區塊的標籤,可以自由調整文字與圖片的間距。

存在設定欄寬的標籤<div>,main_content為識別碼名稱。

 

CSS component的code部分:

對應的CSS內的max-width值不超過80。

--------------------------------------------------------------------

[Example 2] 範例說明:

XHTML component的code部分:

<div>是用來設定區塊的標籤,可以自由調整文字與圖片的間距。

存在設定欄寬的標籤<div>,main_content為識別碼名稱。

 

CSS component的code部分:

對應的CSS內的width值不為空。