HTML - <ins> 標籤



HTML <ins> 標籤表示已插入 HTML 文件的一段文字範圍。此插入文字由 Web 瀏覽器呈現為帶下劃線的文字。HTML <ins> 標籤可以與 <del> 標籤一起使用。

語法

<ins> .... </ins>

屬性

HTML ins 標籤支援 HTML 的 全域性事件 屬性。還有一些特定的屬性,列在下面。

屬性 描述
cite URL 此屬性定義解釋更改的資源的 URL。
datetime YYYY-MM-DDThh:mm:ssTZD 用於指定插入文字的日期和時間。

HTML ins 標籤示例

在下面的示例中,我們將看到 ins 元素的不同示例。每個示例都將說明 html ins 標籤的使用案例。

使用 del 標籤實現 ins

在以下示例中,讓我們看看 <ins> 標籤與 <del> 標籤一起使用的用法。

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="utf-8">
</head>
<body>
   <h1>Tutorialspoint</h1>
   <h2>HTML ins element</h2>
   <p>
      tutorialspoint is a <del>physic classes</del>
      <ins>EdTech company</ins> that provides more 
      than 6000 courses and tutorials
   </p>
</body>
</html>

樣式化 ins 和 del 元素

考慮以下示例,我們正在建立一個 HTML 文件並使用 <ins> 標籤與 <del> 標籤。我們還使用 CSS 屬性來設定 ins 和 del 標籤內容的樣式。

<!DOCTYPE html>
<html lang="en">
<head>
   <meta charset="utf-8">
</head>
   <style>
   del {
      background-color: #fbb;
      color: #555;
   }

   ins {
      background-color: #d4fcbc;
   }
   </style>
</head>
<body>
   <p>
      There is <del>nothing</del>
      <ins>no code</ins> either good or bad, but 
      <del>thinking</del> <ins>running it</ins>
      makes it so.
   </p>
   <p>
      <del>
         When an unknown printer took a galley of type 
         and scrambled it to make a type specimen book
      </del>.
   </p>
</body>
</html>

使用已接受的屬性實現 ins 元素

讓我們看一下以下示例,我們正在建立一個 HTML 文件並使用 <ins> 標籤以及“cite”和“datetime”屬性。

<!DOCTYPE html>
<html>
<head>
   <style>
      del {
         color: red;
      }

      ins {
         color: green;
      }
   </style>
</head>
<body>
   <h1>tutorialspoint</h1>
   <h2>HTML ins Tag</h2>
   <p>
      tutorialspoint is a <del>physics classes</del>
      <ins cite=
"https://tutorialspoint.tw/" datetime="2023-06-14T13:50:03Z"> 
      EdTech company</ins> 
      that provides more than 6000 courses and tutorials
   </p>
</body>
</html>

支援的瀏覽器

標籤 Chrome Edge Firefox Safari Opera
ins
html_tags_reference.htm
廣告