Maison > interface Web > tutoriel HTML > 10 balises HTML peu courantes que vous devez connaître

10 balises HTML peu courantes que vous devez connaître

高洛峰
Libérer: 2017-03-12 17:36:17
original
1359 Les gens l'ont consulté

Cet article parle de 10 balises HTML peu courantes que vous devez connaître

De nos jours, les ingénieurs en développement Web utilisent généralement plus d'un langage dans leurs études et leur travail. Par conséquent, il nous est difficile de comprendre tous les aspects d’une langue. Il est également très difficile de maîtriser une langue, comme l’utilisation de certains mots-clés peu courants mais potentiellement utiles dans la langue.

Bien que nous n'ayons peut-être pas compris ces balises HTML très rares auparavant ou que nous n'ayons pas réussi à les utiliser pleinement, il n'est pas trop tard pour rattraper cela. Nous commençons maintenant à les comprendre et à pouvoir les utiliser correctement. dans le développement futur, il n’est pas trop tard pour ces balises auparavant inutilisées.

Je vous ai présenté ici les 10 balises HTML les plus rares et les plus souvent mal utilisées. Bien qu’elles ne soient pas aussi courantes que les autres balises HTML, elles peuvent néanmoins être très utiles dans certaines situations.

1.

Je pense que tout le monde connaît

, mais saviez-vous que
a en fait un petit frère nommé ? permet de définir un morceau de texte comme une citation au sein d'un élément. Normalement, les navigateurs mettent le texte sous la balise en italique, mais cela peut changer en fonction du CSS.

La balise est très utile pour citer des catalogues de livres et d'autres adresses de sites Web. Voici un exemple d'utilisation de la balise dans un morceau de texte :

La monographie révolutionnaire de Zhang San L'autobiographie de Zhang San a apporté une nouvelle atmosphère à Internet.

2.

Lorsque vous souhaitez ajouter des définitions à des options regroupées selon différents types dans une liste déroulante, la balise Par exemple, si vous souhaitez regrouper des films en fonction du temps, le code pourrait être écrit comme ceci :

<LABEL for=showtimes>Showtimes</LABEL>
<SELECT id=showtimes name=showtimes><OPTGROUP label=1PM></OPTGROUP> <OPTION selected value=titanic>Twister</OPTION> <OPTION value=nd>Napoleon Dynamite</OPTION><OPTION value=wab>What About Bob?</OPTION><OPTGROUP label=2PM></OPTGROUP> <OPTION value=bkrw>Be Kind Rewind</OPTION> <OPTION value=stf>Stranger Than Fiction</OPTION></SELECT>
Copier après la connexion

Exemple :


3. ;acronym>

La balise est généralement utilisée pour ajouter une définition ou une explication plus détaillée à une phrase (expression). Lorsque l'utilisateur passe la souris sur le texte avec la balise ajoutée, l'annotation ou la définition ajoutée sera affichée sous le texte. Par exemple :

Le site Web Weibo Twitter a récemment provoqué une nouvelle tendance sur Internet !

Exemple :

Le site Web Weibo a récemment provoqué une nouvelle tendance sur Internet !

4.

La balise est une balise assez rare, mais cela ne veut pas dire qu'elle est inutile. Comme son nom l'indique, vous permet de marquer sémantiquement des adresses en HTML. Cette balise utile met également en italique les données qu'elle contient, cependant, ce style est facilement modifié via CSS.

<address>
中国,上海市,闵行区,XX路,XX小区,XXX室
</address>
Copier après la connexion

Exemple :

Chine, Shanghai, district de Minhang, XX Road, XX Community, Room XXX

5. et

Si vous souhaitez afficher le style d'édition du document via le balisage, et Comme leurs noms l'indiquent, utilise un soulignement pour mettre en évidence le texte qui a été ajouté au document, tandis que utilise un trait barré pour mettre en évidence le texte qui en a été supprimé.

没有了驴子,我们的日子还要怎么<DEL>过下去</DEL> <INS>活下去</INS>?
Copier après la connexion

Exemple : Sans ânes, comment pouvons-nous vivrevivre ?

. Non seulement ces

7.
<LABEL for="username">用户名</LABEL>  
<INPUT id="username" type="text">
Copier après la connexion

est une balise très utile qui peut logiquement regrouper des éléments associés au sein du formulaire. Une fois ces éléments regroupés à l'aide de la balise
, un titre peut être défini pour le regroupement en liant la balise

Exemple :
<FORM><FIELDSET>  
<LEGEND>你觉得自己牛X么?</LEGEND>  
Yes<INPUT value=yes type=radio name=yes>  
No <INPUT value=no type=radio name=no>  
</FIELDSET>  
</FORM>
Copier après la connexion

8.

是一类的标签,只是标签只用于定义缩写的词组。就像,相当于你给元素添加了一个标题或称号。当用户将鼠标悬停在缩写词上面,它的全称会在下方显示。标签很少被用到,不过它对屏幕阅读器,拼写检查程序和搜索引擎很有用。

他<ABBR title="妈">文明用语</ABBR>的
Copier après la connexion

例子:他文明用语的!

9. rel

Rel是一个相当有用的属性,基本上任何一个HTML元素都可以应用Rel属性(注1)。它可以为那些没有别的方式提供详细信息的元素提供额外的信息。这在javascript和HTML一起工作时尤其有用。如果你有一个你可能想在内部编辑,你可以这样添加代码:

<html>
<body>
<p><a id="myAnchor" rel="index"
href="http://www.w3school.com.cn">Visit W3School.com.cn</a></p>
<script type="text/javascript">
x=document.getElementById("myAnchor");
document.write(x.rel);
</script>
</body>
</html>
Copier après la connexion

     javascript会找到rel属性为clickable的link元素,然后它可以接着通过ajax内部改变元素。当然,这个只是你可以应用rel属性的无数种情况中的一种,你可以用其他方式来很好的使用rel属性。

10.

     (注2)是个基本已经销声匿迹的标签。坦诚的说,我怀疑读者中的大多数都没接触过这个标签,毕竟它太少用到了(真的,在写这篇文章之前,我自己都没见过这个标签)。这个标签允许你指定一块区域来强制使用换行符,但仅仅是确实必要的时候。该元素很特殊因为它定义在浏览器中添加换行符,如果需要的话,它可以在你极力避免浏览器中出现横向的滚动条时实现符合要求的界面。

如果你想在不必使用标签的情况下达到相同的效果,你也可以尝试​或­ 。但千万注意,这三个标签中没有一个可以完全支持所有浏览器的。如果你想看看哪些浏览器支持这三种标签可以看看这篇文章。

 译者注:

注1,实际上rel通常用在a和link标签中,它常和rev一起出现。

注2,wbr不是标准的html标签,它最开始是网景公司添加的,但随后被移除掉了。 

附注:

      这篇文章仅仅是一个参考,实际上,由于一些地方使用和解释得并不清楚, 它也引起了比较多的争论,建议如果确实对这些标签有兴趣研究的朋友,可以参看下原文地址并仔细的查看文章的一些回复。

      另外有朋友认为这些少见的标签兼容性会很差,所以我们应少用。然而恰恰相反,上面列举的标签,除了最后一个不符合标准不推荐使用之外,其他都符合W3C标准,它们兼容目前任何主流浏览器。当然,由于功能基本一样,在新的html 5标准中不推荐使用,w3c推荐用代替

       最后有人可能认为这里的一些标签都可以用其他一些常见标签实现相同功能,因此没必要使用。不过正如回复中沉默杨仔所说:“w3c就是要语义化页面内容”,对用户说,可能你可以通过普通标签实现一样的功能,但对机器(e.g.屏幕阅读器,单词拼写检查程序,搜索引擎等)来说,这种标签它们更容易懂。所以我认为,如果你的网页中真有这些标签可以应用的场合,最好还是使用这些标签来实现相应的功能。

 

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:php.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal