HTML标签不常见
#html #网络开发人员 #初学者 #标签

在开始学习HTML时,有常用的HTML标签,这些标签引入了初学者,这些常用的标签包括:<html><title><title><body><p><p><a><a><a><div>等。与上述列表相比,HTML标签还要多。 。这些不常见的HTML标签对于更为高级和特定的用例还是很有用的。让我们首先讨论下面HTML的含义。

html(超文本标记语言)是网络的基础。它允许Web开发人员创建内容,结构和格式化,并在网页上显示。

在本文中,我分享了一些不常见的HTML标签,这些标签有一天对您有用。

让我们开始。

  • <details><summary>7

<details><summary>标签用于在网页上创建内容的可折叠部分。 <summary>标签用于为可折叠部分提供标题,而<details>标签用于包含可以扩展或折叠的内容。当您想在页面上提供大量信息时,此标签很有用,但不想一次让用户淹没您的用户太多信息。

例如:

<details>
         <summary>Click to View my Profile</summary>
         <p>Hi,my name is Augustine Rita. I'm a technical writer. Nice to meet you here.</p>
 </details>

Image description

Image description

运行上述代码时,您将使用红色箭头获得输出,请单击箭头指向的位置,然后在第二张图像上获得结果。

  • <mark>

<mark>标签用于突出网页上的文本。当您想将注意力引起特定单词或短语(例如关键字或报价)时,这很有用。使用时,默认情况下,标签内的文本将以黄色突出显示,但是您可以使用CSS更改突出显示的颜色。

例如:

Children naturally love <mark> Quality Attention</mark> and <mark>Recogination</mark>.

这是上述代码的结果。

Image description

  • <time>

标签用于以标准格式显示日期或时间。当您想以易于理解的方式显示日期或时间时,此标签很有用。使用时,标签需要一个DateTime属性,该属性以特定格式指定日期和时间。
例如:

<p>The current time is <time datetime="2023-04-22T15:30:00-07:00">3:30 PM Pacific Time</time>.</p>

给出输出。

Image description

在上面的示例中,我们使用

>
  • <abbr>

<abbr>标签用于为单词或短语提供缩写或缩写。使用时, tag is displayed with a dotted underline by default, indicating that it is an abbreviation. When the user hovers over the text, a tooltip will appear containing the full text of the abbreviation.

For example:

daima3

The output will be as shown below.

Image description

内的文字

Image description

在上面的示例中,可见的文本为“ html”,但是当用户徘徊在文本上时,工具提示将出现,其中包含完整文本的“超文本标记语言”,如上所示。标题属性用于指定将在工具提示中显示的缩写的全文。

  • <ruby><rt><rp>

<ruby><rt><rp>标签是html标签,用于组合用来为东亚语言提供注释,例如日语,中文和韩语。

这是他们一起工作的方式:

<ruby>标签用于定义红宝石注释,这是出现在基本文本上方或旁边的小文本注释。

<rt>标签用于定义红宝石文本,这是出现为注释的文本。

<rp>标签用于定义红宝石括号,这是围绕红宝石文本的字符。

例如:

<ruby>    
       漢 <rp>(</rp><rt>Kan</rt><rp>)</rp>
   </ruby>

上面的HTML代码将提供输出。

Image description

让我用英语重写代码,以便每个人都能理解。

 <ruby>
       Augustine <rp>(</rp><rt>Surname</rt><rp>)</rp>
 </ruby>
 <ruby>
       Rita <rp>(</rp><rt>Lastname</rt><rp>)</rp>
 </ruby>

输出变为。

Image description

  • <s>

<s>标签是一个HTML标签,用于指示文本已被击中或“划掉”。使用时,将显示<s>标签中的文本,并通过绘制的线路绘制。此标签主要用于电子商务网站,以指示产品的旧价格和新价格。

例如;

<p>old price <s>$100</s>.</p>
     <p>New price $70</p>

输出变为。

Image description

  • <optgroup>

<optgroup>标签是一个HTML标签,用于分组<select>元素中的相关元素。 <optgroup>标签允许您将选项组织为不同的类别或组,从而使用户更容易导航和选择适当的选项。

例如。

<select>
         <optgroup label="Fruits">
           <option value="apple">Apple</option>
           <option value="banana">Banana</option>
           <option value="orange">Orange</option>
         </optgroup>
         <optgroup label="Vegetables">
           <option value="carrot">Carrot</option>
           <option value="celery">Celery</option>
           <option value="lettuce">Lettuce</option>
         </optgroup>
     </select>

输出变为。

Image description

按下下拉箭头时,将出现如下所示水果和蔬菜的完整选项。

Image description

结论:

在本文中,我们介绍了一些最不常见的HTML标签。尽管这些不常见的HTML标签可能不是每个网页所必需的,但在某些情况下它们可能非常有用。通过理解和使用这些标签,您可以使您的网页更具功能性和用户友好。

感谢您的阅读,如果您喜欢本文,请考虑在Twitter上与我联系。

欢呼!