10 balises HTML sous-utilisées ou mal comprises_HTML/Xhtml_Web Design

Voici 10 balises HTML sous-utilisées ou incomprises. Ils ne sont peut-être pas très connus, mais ils peuvent être très utiles dans certaines situations.
Les développeurs Web souhaitent souvent connaître et maîtriser plusieurs langues. Par conséquent, apprendre tous les tenants et aboutissants d'une langue peut être délicat, mais il est facile de constater que vous n'utilisez pas pleinement les balises spéciales mais utiles.
Traduit de : TutsPlus
Malheureusement, nous n'avons pas encore exploité tout le potentiel de ces balises HTML plus obscures. Mais il n’est jamais trop tard pour revenir sur le terrain et commencer à écrire du code pour exploiter la puissance de ces étiquettes inexploitées.
Voici 10 balises HTML sous-utilisées ou incomprises. Ils ne sont peut-être pas très connus, mais ils peuvent être très utiles dans certaines situations.
1.
Il semble que tout le monde connaisse le tag

, mais connaissez-vous le petit frère de

 ? vous permet de définir du texte dans l'élément comme référence. Normalement, les navigateurs mettent en italique le texte dans la balise , mais cela peut être modifié avec un peu de CSS. La balise
est utile pour citer des références dans des annuaires ou d'autres sites Web. Voici un exemple d’utilisation de la balise cite dans un paragraphe :
Le livre organisationnel révolutionnaire de David Allen Get Your Work Done prend d'assaut l'oubli. 2. La balise
est un excellent moyen de définir un regroupement d'options au sein d'une balise de sélection. Par exemple, si vous devez regrouper une liste de films par heure, vous pouvez procéder comme suit :
1 2
étiquette pour="horaires">Horaires des séances/ étiquette> sélectionner id="horaires" nom= "horaires"> optgroup label="One PM">/ optgroup> option valeur="titanic">Titanic/option> option valeur= "nd">Slumdog Millionaire/option> option valeur="wab">Shrek/option> optgroup label="Deux heures de l'après-midi">/optgroup > option valeur="bkrw">Le Roi Lion/option> option valeur="stf" > Superman pour tous/option> /sélectionner>
Démo :
Heure de sortie Titanic Slumdog Millionnaire Shrek Le Roi Lion Superman pour tous

Il peut différencier visuellement la liste des films. 3.
est une manière de définir ou d'expliquer davantage un ensemble de mots. Lorsque vous passez la souris sur du texte à l'aide de la balise , une boîte affichant le contenu de la balise de titre apparaîtra en dessous. Par exemple:
1
Site Web du micro blogacronyme titre="Fondé en 2006"> Twitter/acronyme> Il a beaucoup baissé ces derniers temps.
Exemple :
Le site de micro-blogging Twitter a été fréquemment en panne récemment. 4.

La balise

est une petite balise très discrète, mais cela ne veut pas dire qu’elle est inutile. Comme son nom l'indique

permet de sémantiser les balises en HTML. Cette balise compacte affichera le contenu de la balise en italique par défaut. Bien entendu, le style par défaut peut être facilement modifié à l'aide de styles.
1 2 3 4
adresse>Glen Stansberry 1234, voie des développeurs Web N'importe où, aux États-Unis /adresse> 5. et
Si vous souhaitez utiliser des balises pour afficher les versions éditées, et sont parfaits pour cela. Comme son nom l'indique, met en évidence le contenu ajouté avec des soulignements, tandis que affiche les informations supprimées avec des barrés.
1
John del>j'aime/del> ins >AIME/ins> son nouvel iPod.
Exemple :
Tout le monde aime abandonné Zblog. 6.
Il semble que les éléments de formulaire soient les plus faciles à oublier lorsqu'il faut marquer du texte. Pour les éléments de formulaire, la plus souvent oubliée est la balise . Non seulement c'est un moyen pratique de baliser du texte, mais la balise peut également recevoir un attribut "for" pour spécifier quel élément sera associé. Non seulement il est facile à contrôler avec les styles, mais il vous permet également de rendre le titre cliquable.
1 2
étiquette pour="nom d'utilisateur">nom d'utilisateur/étiquette> entrée id="nom d'utilisateur" type= "texte" /> 7.

Fieldset est une petite balise que vous pouvez utiliser pour ajouter des regroupements logiques aux éléments de votre formulaire. La balise

dessinera un cadre autour de l'élément à l'intérieur. Un autre point est que vous pouvez ajouter la balise dans le champset pour définir le titre du groupe.
1 2 3 4 5 6 7
formulaire>ensemble de champs> légende>Es-tu plus intelligent qu'un élève de 5ème ? /légende> Bien sûrsaisie nom="oui" type="radio" valeur="oui" /> Je ne sais passaisie nom="non" type="radio" valeur="non" /> /ensemble de champs> /formulaire>
Exemple : 8. La balise
est assez similaire à la balise , sauf que la balise ne sert qu'à définir des mots abrégés. Tout comme , vous pouvez définir un attribut de titre pour cette balise. Lorsque l'utilisateur place la souris sur le texte de l'abréviation, l'intégralité du contenu sera affichée en dessous. La balise est rarement utilisée, mais elle est très utile pour les lecteurs d'écran, les correcteurs orthographiques et les moteurs de recherche.
1
abbr titre="Brainless">NC/abbr> est un terme non civilisé.
Exemple :
est un terme non civilisé. est un terme non civilisé. 9.rel
Rel peut être un attribut extrêmement utile, n'importe quel élément HTML peut avoir un attribut rel qui lui est appliqué. Cela permet de transmettre des paramètres supplémentaires qui ne sont pas spécifiés autrement. Ceci est très utile lors de l'utilisation de JavaScript en HTML. Si vous souhaitez modifier un lien en ligne, vous pouvez ajouter :
1
a rel="cliquable" href= "page.html">Ce lien est modifiable. /un>
Javascript recherchera un lien avec l'attribut rel "cliquable", appliquera un peu d'Ajax et permettra de le modifier en ligne. Ce n’est qu’une des nombreuses techniques que vous pouvez utiliser avec l’attribut rel, car son potentiel est infini. Les amis intéressés peuvent étudier en profondeur l'introduction du W3C à Rel. 10. La balise
est une balise incroyablement inconnue. Franchement, je doute que vous rencontriez un jour cette étiquette, car elle n’est presque jamais utilisée. (En effet, j’avais à peine vu cette étiquette avant d’écrire cet article). En fait, cette étiquette est un saut de ligne souple, qui vous permet de spécifier un point de saut de ligne à l'intérieur d'une certaine ligne, indiquant que la ligne peut être interrompue à ce stade, mais le saut de ligne ne se produira pas nécessairement et la ligne ne fera que être rompu lorsqu'il est nécessaire de rompre la ligne. L'utilisation de cette balise est idéale si vous souhaitez éviter les barres de défilement horizontales.
Exemple :
Ci-dessous se trouve une boîte de 200 pixels de large sans débordement défini. NoWbrNoWbrNoWbrNoWbrNoWbrNoWbrNoWbrNoWbrNoWbr
HavaWbrHavaWbrHavaWbrHavaWbrHavaWbrHavaWbrHavaWbrHavaWbr
Si vous souhaitez obtenir le même effet sans utiliser la balise , vous pouvez essayer ceci ou . On dit qu’aucune de ces trois balises n’est entièrement prise en charge par tous les navigateurs. Vous pouvez utiliser cet article pour vérifier la prise en charge de chaque navigateur pour les trois balises.
PS : Il a été assez difficile de traduire cet article. Shenfei a profondément ressenti le charme de la sémantique et le pouvoir des balises HTML. Je crois qu'il y a de nombreuses balises que nous n'avons pas réalisées. En conséquence, tout le monde connaît les balises communes. Il existe des balises familières et inhabituelles que tout le monde n’utilisera pas. Comme je l'ai expliqué dans un article précédent, une grande partie de la « sémantique » consiste à utiliser les bonnes balises aux bons endroits au lieu de simplement utiliser des div. Si nous pouvons comprendre plus de balises HTML, nous pouvons écrire du code HTML plus sémantique, ce qui peut également réduire considérablement la difficulté et la charge de travail liées à l'écriture de CSS et rendre la structure de nos pages plus raisonnable.