recherche

Maison >interface Web >tutoriel HTML >Balise de sélection HTML

Balise de sélection HTML

王林
王林original
2024-09-04 16:23:041150parcourir

La balise de sélection en HTML est utilisée pour créer un défilement sur le texte ou l'image dans la page Web, ce qui permet tous les types de défilement comme de gauche à droite, de droite à gauche, de haut en bas et de bas en haut. La syntaxe de cette balise en HTML est Il s’agit d’un défilement du texte…< /marquee>, où la balise 'marquee' est utilisée pour décrire les propriétés du parchemin requis. Quelques autres attributs de sélection couramment utilisés sont behavior, hspace, scrollamount, scrolldelay, truespeed, vspace, etc.

Syntaxe :

Le chapiteau peut être utilisé en utilisant le bouton élément. La syntaxe peut être écrite comme indiqué ci-dessous :

<html>
<body>
<marquee direction="up" height="150" width="250" bgcolor="white">This is scrolling of the text...</marquee>
</body>
</html>

Attributs de la balise HTML Marquee

Voici les attributs pris en charge par le étiquette.

  1. comportement : L'action de faire défiler le texte qui peut être l'une des valeurs, notamment alternative, défilement et diapositive.
  2. bgcolor : Il donne la couleur d'arrière-plan.
  3. direction : Il spécifie la direction de défilement du texte avec des valeurs gauche, droite, haut et bas. La valeur de direction par défaut est gauche.
  4. hauteur : Il définit une hauteur pour le chapiteau.
  5. hspace : Cet attribut fournit un espace horizontal autour de l'élément de sélection.
  6. boucle : Il définit combien de fois le texte peut défiler. Le chapiteau bouclera en continu si la valeur par défaut est -1.
  7. scrollamount : Il spécifie le montant de défilement pour chaque intervalle. Si aucun montant de défilement n'est défini, la valeur par défaut est 6.
  8. scrolldelay : Il donne le délai de défilement en millisecondes. Si aucun montant de défilement n'est défini, la valeur par défaut est 6.
  9. truespeed : Il est utilisé pour indiquer la valeur du délai de défilement de 60.
  10. vspace : Cet attribut fournit un espace vertical autour de l'élément de sélection.
  11. largeur : Il définit une largeur pour le chapiteau.

Exemples de balise HTML Marquee

Voici les exemples de balises HTML chapiteau expliquées ci-dessous :

Exemple n°1 – Marquee à gauche

Ce type de chapiteau peut être utilisé pour déplacer le contenu du côté gauche.

Code :

<!DOCTYPE html>
<html>
<head>
<title>Left Marquee</title>
<style>
.mrq_class {
text-align:center;
}
.marq_class1 {
padding-top:25px;
padding-bottom:25px;
}
.txt {
font-size:30px;
font-weight:italic;
color:white;
padding-bottom:10px;
}
</style>
</head>
<body>
<div class = "mrq_class">
<marquee class="marq_class1" bgcolor = "grey" direction = "left" loop="" >
<div class="txt">Welcome to EDUCBA...</div>
<div>EDUCBA is a leading global provider of skill based education addressing the needs 500,000+ members across 40+ Countries.</div>
</marquee>
</div>
</body>
</html>

Sortie :

  • Enregistrez le code ci-dessus dans un fichier avec une extension .html
  • Exécutez le fichier HTML dans un navigateur et vous obtiendrez le résultat comme indiqué dans l'image ci-dessous

Balise de sélection HTML

Exemple n°2 – Marquee à droite

Ce type de chapiteau peut être utilisé pour déplacer le contenu vers la droite.

Code :

<!DOCTYPE html>
<html>
<head>
<title>Right Marquee</title>
<style>
.mrq_class {
text-align:center;
}
.marq_class1 {
padding-top:25px;
padding-bottom:25px;
}
.txt {
font-size:30px;
font-weight:italic;
color:white;
padding-bottom:10px;
}
</style>
</head>
<body>
<div class = "mrq_class">
<marquee class="marq_class1" bgcolor = "grey" direction = "right" loop="" >
<div class="txt">Welcome to EDUCBA...</div>
<div>EDUCBA is a leading global provider of skill based education addressing the needs 500,000+ members across 40+ Countries.</div>
</marquee>
</div>
</body>
</html>

Sortie :

Balise de sélection HTML

Exemple n°3 – Marquee vers le haut

Ce type de chapiteau peut être utilisé pour déplacer le contenu vers le haut.

Code :

<!DOCTYPE html>
<html>
<head>
<title>Up Marquee</title>
<style>
.mrq_class {
text-align:center;
}
.marq_class1 {
padding-top:25px;
padding-bottom:25px;
}
.txt {
font-size:30px;
font-weight:italic;
color:white;
padding-bottom:10px;
}
</style>
</head>
<body>
<div class = "mrq_class">
<marquee class="marq_class1" bgcolor = "grey" direction = "up" loop="" >
<div class="txt">Welcome to EDUCBA...</div>
<div>EDUCBA is a leading global provider of skill based education addressing the needs 500,000+ members across 40+ Countries.</div>
</marquee>
</div>
</body>
</html>

Sortie :

Balise de sélection HTML

Exemple n°4 – Marquee vers le bas

Ce type de chapiteau peut être utilisé pour déplacer le contenu vers le bas.

Code :

<!DOCTYPE html>
<html>
<head>
<title>Down Marquee</title>
<style>
.mrq_class {
text-align:center;
}
.marq_class1 {
padding-top:25px;
padding-bottom:25px;
}
.txt {
font-size:30px;
font-weight:italic;
color:white;
padding-bottom:10px;
}
</style>
</head>
<body>
<div class = "mrq_class">
<marquee class="marq_class1" bgcolor = "grey" direction = "down" loop="" >
<div class="txt">Welcome to EDUCBA...</div>
<div>EDUCBA is a leading global provider of skill based education addressing the needs 500,000+ members across 40+ Countries.</div>
</marquee>
</div>
</body>
</html>

Sortie :

Balise de sélection HTML

Exemple n°5 – Chapiteau imbriqué

Ce type de chapiteau peut être utilisé pour imbriquer le contenu.

Code :

<!DOCTYPE html>
<html>
<head>
<title>Nested Marquee</title>
<style>
.mrq_class {
text-align:center;
}
.marq_class1 {
padding-top:25px;
padding-bottom:25px;
}
.txt {
font-size:30px;
font-weight:italic;
color:white;
padding-bottom:10px;
}
</style>
</head>
<body>
<div class = "mrq_class">
<marquee class="marq_class1" bgcolor = "grey" direction = "down" behavior="alternate" height="150" >
<marquee behavior="alternate"><div class="txt">Welcome to EDUCBA...</div></marquee>
<div>EDUCBA is a leading global provider of skill based education addressing the needs 500,000+ members across 40+ Countries.</div>
</marquee>
</div>
</body>
</html>

Sortie :

Balise de sélection HTML

Exemple n°6 – Comparaison de vitesse pour Marquee

La vitesse de l'élément de sélection peut être spécifiée en utilisant l'attribut scrolldelay.

Code :

<!DOCTYPE html>
<html>
<head>
<title>Nested Marquee</title>
<style>
.marq_class1 {
padding-top:25px;
padding-bottom:25px;
}
</style>
</head>
<body>
<marquee class="marq_class1" bgcolor = "grey" direction = "down" behavior="alternate" height="150" >
<marquee scrolldelay="80" scrollamount="7">Welcome to EDUCBA...(normal speed)</marquee>
<marquee scrolldelay="60" scrollamount="12" truespeed>Welcome to EDUCBA...(This is very speed)</marquee>
<marquee scrolldelay="250" scrollamount="4">Welcome to EDUCBA...(This is very slow)</marquee>
</marquee>
</body>
</html>

Sortie :

Balise de sélection HTML

Exemple n°7 – Couleur et espace d’arrière-plan de la marque

Ce type de chapiteau peut être utilisé pour définir la couleur d'arrière-plan et l'espace de l'élément de chapiteau.

Code :

<!DOCTYPE html>
<html>
<head>
<title>Marquee Background and Space</title>
<style>
.mrq_class {
text-align:center;
}
.marq_class1 {
padding-top:25px;
padding-bottom:25px;
}
</style>
</head>
<body>
<div class = "mrq_class">
<marquee class="marq_class1"  bgcolor="#d9d9ff" hspace="50" vspace="20">
<div>EDUCBA is a leading global provider of skill based education addressing the needs 500,000+ members across 40+ Countries.</div>
</marquee>
</div>
</body>
</html>

Sortie :

Balise de sélection HTML

Conclusion

Jusqu'à présent, nous avons étudié comment la balise marquee sera utilisée pour créer du texte défilant sur la page Web. L'utilisateur peut facilement créer du texte défilant horizontalement ou verticalement sur les sites Web. Cet élément est obsolète et ne sera plus utilisé. Pour créer l'effet de défilement, CSS ou JavaScript seront utilisés.

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!

JavaScript css html if for using Attribute default 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：Balise map en HTMLArticle suivant：Balise map en HTML

Articles Liés

Voir plus