Maison >interface Web >tutoriel HTML >Liste de descriptions HTML

Liste de descriptions HTML

WBOYoriginal: 2024-09-04 16:44:11586parcourir

Cet article décrit la liste de description ou la liste de définition et son utilité dans un document HTML. Alors comment définir une liste de description ? En termes simples, nous pouvons dire qu'il s'agit d'une liste de définitions (par exemple, des glossaires pour présenter les informations sur Internet/page Web). Cependant, l'utilisation de la liste Description est moindre mais a un certain objectif. Pendant ce temps, cette liste de définitions donne une valeur ajoutée à la page Web ; par exemple, le texte donné sur la page Web explique le contexte en d'autres termes en aidant à baliser sémantiquement le contexte. En faisant cela, nous pouvons facilement extraire les informations structurées. Une liste de définitions est un terme parfait pour décrire les termes, les valeurs et un autre glossaire.

Syntaxe :

<dl>
<dt>
……
</dt>
<dd>
………..
</dd>
</dl

Il y a trois éléments dans la liste de description, ce sont

,

Liste de définition
– Elle est utilisée pour décrire les nombreux non. de termes dans les informations répertoriées et forme une balise externe. Il transmet comme dans les documents normaux ou est souvent utilisé comme glossaire.
Terme de définition
– Cet élément a actuellement été utilisé dans la liste de définitions et contient les données en ligne ou la valeur de l'élément dl.
Description de la définition
-Cet élément définit que les données sous cet élément sont prises au niveau du bloc ou en ligne.

Balises de liste de descriptions HTML

Une liste de description est l'un des types de listes ; ils sont considérés comme une forme générique de liste à puces ordonnée. La seule différence est qu'il n'y a pas d'icône de puce.

Remarque : Toute liste de définitions comprend une séquence de

combinaisons/combinaisons de relations un à plusieurs. Ces balises de description sont prises en charge en HTML4 et améliorées avec de nouveaux termes en HTML5 sous forme de davantage de paires nom-valeur. Il fait un lien d’association entre question et réponses.

Type 1 : terme à définition unique et définition ensemble

Exemple n°1

<!DOCTYPE html>
<html>
<body>
<dl>
<dt><b>Web Designing company in Chennai<b></dt>
<dd>This service Enhance Website Exposure with professional User Interface </dd>
</dl>
</body>
</html>

Sortie :

Liste de descriptions HTML

Exemple n°2

<html>
<head>
<title>Page Title</title>
<style>
body {
background-color: pink;
text-align: center;
color: blue;
font-family: Arial, italic;
}
</style>
</head>
<body>
<h1>HTML Demo 2</h1>
<p>This is Networking Protocol Abbreviation.</p>
<dl>
<dt>FTP
<dd>File Transfer Protocol
<dt>TCP/IP
<dd>Transmission Control Protocol/IP address
<dt>SNMP
<dd>Simple Network Management Protocol
</dl>
</body>
</html>

Sortie :
Liste de descriptions HTML

Type 2 : description unique avec plusieurs termes

Exemple n°1

<!DOCTYPE html>
<html>
<body>
<dl>
<dt> Ebay</dt>
<dt>Etsy</dt>
<dt>Walmart</dt>
<dd>The Top 10 internet shopping websites in the year 2019</dd>
</dl>
</body>
</html>

Sortie :

Liste de descriptions HTML

Ensuite, nous utiliserons l'attribut 'lang' dans le fichier

où les termes utilisent des langues différentes. Ces attributs affichent le code de langue ISO comme valeur à deux lettres.

Exemple n°2

<!DOCTYPE html>
<html>
<body>
<h2>A Description HTML list</h2>
<dl lang="es">
<dt>formas</dt>
<dt lang="en-us">Shapes</dt>
<dt lang="fr">Formes</dt>
<dd>A Shape determines the different structure of the objects. </dd>
</dl>
</body>
</html>

Sortie :

Liste de descriptions HTML

Type 3 : terme unique décrivant plusieurs descriptions

Exemple

<html>
<head>
<title>DEFINITION LIST</title>
</head>
<body bgcolor=" brown" text="pink">
<h1><u>DEFINITION LIST DEMO</u></h1>
<h3>
<dl>
<dt lang="es"><u>Compact:</u></dt>
<dd>A Compact may refer to make-up case.
</dd>
<dd>When taken as adjective it refers to smaller part. Example, need a compact sofa to sit.</dd>
</dl>
<h3>
</body>
</html>

Sortie :

Liste de descriptions HTML

Type 4 : termes multiples et descriptions multiples

Exemple

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.1">
<title>Definition List example</title>
</head>
<body>
<h1>Definition List Demo4</h1>
<dl>
<dt> Engaged</dt>
<dt>Leaves</dt>
<dd>Students got engaged during their Lab hours in the college.</dd>
<dd>Childrens feels when their father leaves for the work.</dd>
</dl>
</body>
</html>

Sortie :

Liste de descriptions HTML

Type 5 : Liste de définitions utilisant l'attribut de style

Ici, l'attribut de style est indiqué pour les couleurs afin de mettre en évidence les termes de description.

Exemple n°1

<html>
<head> HTML Definition Lists </head>
<body>
<h2> list of Popular International Entrance Examination <h2>
<dl>
<dt style="color:Blue"> TOEFL </dt>
<dd> -: Test of English As Foreign Language . This Score is Accepted in the country like Canada,UK,USA</dd>
<br>
<dt style="color:Magenta"> GRE </dt>
<dd> -: The Graduate Record Examination. This Test is allowed to enter in the States like Canada and US foran indian Students in the Science and Technology Fields  </dd>
</dl>
</body>
</html>

Sortie :

Liste de descriptions HTML

En utilisant l'option balise, il est entendu que le texte voisin est désigné comme étant la définition du terme.

Exemple n°2

<!DOCTYPE html>
<html>
<head>
<title> Demo</title>
<dl>
<dt lang="en-GB"><dfn> Definition list</dfn></dt>
<dt><dfn><b>Apple fruit </b></dfn></dt>
<dd>This fruit is quoted as "miracle food" where this gives best nutrients to the body. They are rich in antioxidents</dd>
<dd>A small fragment of apple intakes daily cures cancer,heart disease etc.</dd>
<dd> Different varieties includes Braeburn,Cameo,Fuji,Gala </dd>
</dl>
</html>

Sortie :

Liste de descriptions HTML

Type 6 : Placer la couleur d'arrière-plan pour la liste de description

Les exemples ci-dessous montrent le contenu avec une couleur d'arrière-plan en utilisant l'attribut 'bgcolor'.

Exemple

<html>
<head>
<title>DEFINITION LIST</title>
</head>
<body bgcolor="Green" text="pink">
<h1><u>DEFINITION LIST DEMO</u></h1>
<h3>
<dl>
<dt lang="en-GB"><u>PYTHON:</u></dt>
<dd>Python is a progranning Language originally developed by Guido van. Its an Open Source and Cross-Platform. Applications include Web development, Data Machine Learning
</dd>
</dl>
<h3>
</body>
</html>
</dl>
</html>

Sortie :

Liste de descriptions HTML

Conclusion – Liste de descriptions HTML

Nous espérons que cet article sur les listes de définitions ou pourra être dit comme les listes de glossaires ont guidé pour démontrer certaines des utilisations disponibles que les listes de définitions peuvent être utilisées. Nous avons acquis une compréhension fondamentale de la manière dont ceux-ci peuvent être utilisés pour développer une coopération utile entre des extraits d’informations. Par exemple, le glossaire Google indique comment des informations significatives peuvent être balisées et utilisées de plusieurs manières sur une page Web. Ils disposent de fonctionnalités futures grâce auxquelles certains sites Web utilisent la sémantique pour présenter la beauté de leurs données et réutiliser les informations fournies de manière simple et flexible.

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!

html5 less html define for using Attribute Generic this background

Déclaration：

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

Article précédent：Liste HTML non ordonnéeArticle suivant：Liste HTML non ordonnée

Articles Liés

Voir plus