HTML - scope 屬性

HTML 的 **scope** 是一個 HTML 屬性，用於定義表頭單元格。它用於表頭行、列、colgroup 或 rowgroup。

<th> 元素將單元格指定為一組表格單元格的表頭。scope 和 headers 屬性指定此組的性質。

注意：此屬性由螢幕閱讀器使用，但對瀏覽器沒有可見影響。

如果未定義 scope 屬性，則瀏覽器會自動選擇表頭單元格適用的單元格組。

語法

<th scope=" col | row | colgroup | rowgroup " >

row：表頭與它所屬行的所有單元格相關。
col：表頭與它所屬列的所有單元格相關。
rowgroup：表頭屬於一個 rowgroup，並與它的所有單元格相關。
colgroup：表頭屬於一個 colgroup，並與它的所有單元格相關。

應用於

下面列出的元素允許使用 HTML **scope** 屬性。

元素	描述
<th>	HTML <th> 標籤指定 HTML 表格的表頭單元格。

HTML scope 屬性示例

下面的示例將說明 HTML scope 屬性，以及我們應該在哪裡以及如何使用此屬性！

在“th”標籤中使用 scope='col' 和 scope='row'

輸出視窗顯示一個表格，並且為“th”元素應用的 scope 突出顯示。

<!DOCTYPE html>
<html>

<head>
   <title>HTML th scope Attribute</title>
   <style>
      td,
      th {
         border: 1px solid rgb(190, 190, 190);
         padding: 10px;
      }
      td {
         text-align: center;
      }
      th[scope='col'] {
         background-color: #696969;
         color: #fff;
      }
      th[scope='row'] {
         background-color: #d7d9f2;
      }
   </style>
</head>

<body>
   <h3>HTML scope attribute in 'th'</h3>
   <table>
      <caption>Alien football stars</caption>
      <tr>
         <td>S.NO</td>
         <th scope="col">Player</th>
         <th scope="col">Gloobles</th>
         <th scope="col">Za'taak</th>
      </tr>
      <tr>
         <td>1.</td>
         <th scope="row">TR-7</th>
         <td>7</td>
         <td>4,569</td>
      </tr>
      <tr>
         <td>2.</td>
         <th scope="row">Khiresh Odo</th>
         <td>7</td>
         <td>7,223</td>
      </tr>
      <tr>
         <td>3.</td>
         <th scope="row">Mia Oolong</th>
         <td>9</td>
         <td>6,219</td>
      </tr>
   </table>
</body>

</html>

在“th”標籤中使用 scope='colgroup' 和 scope='rowgroup'

輸出視窗顯示一個表格，並且為“th”元素應用的 scope 以粗體顯示。

<!DOCTYPE html>
<html>

<head>
   <title>HTML th scope Attribute</title>
</head>

<body>
   <h3>HTML scope attribute in 'th'</h3>
   <table border="1">
      <tr>
         <th scope="colgroup">Name</th>
         <th scope="colgroup">Company</th>
         <th scope="colgroup">Roles</th>
      </tr>
      <tr>
         <th scope="rowgroup">Aman</th>
         <td>tutorialspoint</td>
         <td>Technical content Engineer</td>
      </tr>
      <tr>
         <th scope="rowgroup">Vivek</th>
         <td>tutorialspoint</td>
         <td>Developer</td>
      </tr>
   </table>
</body>

</html>

支援的瀏覽器

屬性
scope	是	是	是	是	是

html_attributes_reference.htm

列印頁面