Déplacer du texte en HTML
Sep 04, 2024 pm 04:45 PMDéplacer du texte en HTML est également appelé faire défiler du texte. Nous pouvons faire défiler le texte dans toutes les directions avec une certaine vitesse d'intervalle de temps.
Exemple en temps réel?: Considérons que nous avons fréquemment du contenu important mis à jour sur notre site Web. Si ce contenu est toujours stable, les utilisateurs ne peuvent pas y accéder, donc pour attirer l'attention de l'utilisateur, nous devons toujours faire défiler le contenu mis à jour. En fonction des besoins de l'utilisateur, nous pouvons indiquer de quel c?té le contenu défile. Atteindre cette exigence
Pourquoi utilisons-nous CSS en HTML??
Fournir une logique commune entre toutes les pages?; au lieu d'écrire la même logique de style dans chaque page HTML, nous utilisons un fichier CSS pour écrire une logique commune. Et incluez cette page CSS dans chaque page HTML avec étiquette.
Comment fonctionne la balise Marquee en HTML??
Le contenu peut être déplacé en appliquant
Syntaxe n°1
<marquee> //some text to move </marquee>
Syntaxe #2
<marquee direction=”left or right or up or down”> //some text to move </marquee>
Syntaxe #3
<marquee behavior="alternate"> //it makes the text back direction by touching the border of the page. //some text to move </marquee>
Syntaxe #4
<marquee direction=”left” scrollamount="5">// scrollamount used to set the scrolling text speed //some text to move </marquee>Remarque?: La direction du chapiteau par défaut est correcte si nous n'avons fourni aucune propriété de direction.
Exemples d'implémentation de texte animé en HTML
Voici les exemples mentionnés?:
Exemple n°1
Balise de sélection par défaut
Code :
<!DOCTYPE html> <html> <head> <title>Move Text</title> <style> body { background-color: green; text-align: center; color: white; font-family: Arial; } </style> </head> <body> <h1>Moving Text with Marquee Tag</h1> <marquee> 2020 is year bewildered each and every individual of the world due to pandemic COVID-19. This disease is caused by CARONA virus. Till date there is no medicine or vaccine for this disease. So the only option in our hands is to follow instructions strictly announced by World Health Organization. Italy is affected with this virus more worsen because of there is no initial preventive measures in the country. Fight back against the virus every individual should home quarantine. Clean the hands every time if are out from the same place. Strictly say no to hand shake instead respect them back with namaskar. Do not contact any person until state and center curfew is over. Now India also greatly affected by this COVID-19 virus because of foreigners. Who ever come to India from other country they must undergone to quarantine at least 14 days. After finishing quarantine they must go for CARONA test. </marquee> </body> </html>
Sortie?:
Explication?: Comme vous pouvez le voir dans le texte ci-dessus déplacé de droite à gauche, même si nous n'avons mentionné aucune direction, il s'agit donc de la balise de sélection par défaut.
Exemple n°2
Marquez la balise dans le bon sens.
Code :
<!DOCTYPE html> <html> <head> <title>Move Text</title> <style> body { background-color: maroon; text-align: center; color: white; font-family: Arial; } </style> </head> <body> <h1>Moving Text with Marquee Tag</h1> <marquee direction="right"> 2020 is year bewildered each and every individual of the world due to pandemic COVID-19. This disease is caused by CARONA virus. Till date there is no medicine or vaccine for this disease. So the only option in our hands is to follow instructions strictly announced by World Health Organization. Italy is affected with this virus more worsen because of there is no initial preventive measures in the country. Fight back against the virus every individual should home quarantine. Clean the hands every time if are out from the same place. Strictly say no to hand shake instead respect them back with namaskar. Do not contact any person until state and center curfew is over. Now India also greatly affected by this COVID-19 virus because of foreigners. Who ever come to India from other country they must undergone to quarantine at least 14 days. After finishing quarantine they must go for CARONA test. </marquee> </body> </html>
Sortie?:
Explication?: Comme vous pouvez le voir dans le texte ci-dessus, déplacé de gauche à droite en définissant la propriété de direction vers la droite.
Exemple #3
Chapiteau en direction du haut
Code :
<!DOCTYPE html> <html> <head> <title>Move Text</title> <style> body { background-color: blue; text-align: center; color: white; font-family: Arial; } </style> </head> <body> <h1>Moving Text with Marquee Tag</h1> <marquee direction="up"> 2020 is year bewildered each and every individual of the world due to pandemic COVID-19. This disease is caused by CARONA virus. Till date there is no medicine or vaccine for this disease. So the only option in our hands is to follow instructions strictly announced by World Health Organization. Italy is affected with this virus more worsen because of there is no initial preventive measures in the country. Fight back against the virus every individual should home quarantine. Clean the hands every time if are out from the same place. Strictly say no to hand shake instead respect them back with namaskar. Do not contact any person until state and center curfew is over. Now India also greatly affected by this COVID-19 virus because of foreigners. Who ever come to India from other country they must undergone to quarantine at least 14 days. After finishing quarantine they must go for CARONA test. </marquee> </body> </html>
Sortie?:
Explication?: Comme vous pouvez le voir dans le texte ci-dessus, déplacé de bas en haut en définissant la propriété direction sur vers le haut.
Exemple n°4
Chapiteau vers le bas.
Code :
<!DOCTYPE html> <html> <head> <title>Move Text</title> <style> body { background-color: orange; text-align: center; color: white; font-family: Arial; } </style> </head> <body> <h1>Moving Text with Marquee Tag</h1> <marquee direction="down"> 2020 is year bewildered each and every individual of the world due to pandemic COVID-19. This disease is caused by CARONA virus. Till date there is no medicine or vaccine for this disease. So the only option in our hands is to follow instructions strictly announced by World Health Organization. Italy is affected with this virus more worsen because of there is no initial preventive measures in the country. Fight back against the virus every individual should home quarantine. Clean the hands every time if are out from the same place. Strictly say no to hand shake instead respect them back with namaskar. Do not contact any person until state and center curfew is over. Now India also greatly affected by this COVID-19 virus because of foreigners. Who ever come to India from other country they must undergone to quarantine at least 14 days. After finishing quarantine they must go for CARONA test. </marquee> </body> </html>
Sortie?:
Explication?: Comme vous pouvez le voir dans le texte ci-dessus, déplacé de haut en bas en définissant la propriété direction sur vers le bas.
Exemple #5
Marque avec propriété de comportement.
Code :
<!DOCTYPE html> <html> <head> <title>Move Text</title> <style> body { background-color: lightblue; text-align: center; color: brown; font-family: Arial; border: solid 2px red; } </style> </head> <body> <h1>Moving Text with Marquee Tag</h1> <marquee behavior="alternate"> Hi, I am an alternate proeprty </marquee> </body> </html>
Sortie?:
Explication?: Comme vous pouvez le voir dans le texte ci-dessus, déplacé de gauche à droite et de droite à gauche en touchant la bordure en définissant la propriété de comportement sur alterner.
Exemple #6
Marquee avec propriété de montant de défilement.
Code :
<!DOCTYPE html> <html> <head> <title>Move Text</title> <style> body { background-color: fuchsia; text-align: center; color: white; font-family: Arial; border: solid 2px red; } </style> </head> <body> <h1>Moving Text with Marquee Tag</h1> <marquee direction="left" scrollamount="2"> Paramesh </marquee> <marquee scrollamount="4"> Amardeep </marquee> <marquee scrollamount="6"> Harinath-Rajitha </marquee> </body> </html>
Sortie?:
Explication?: Comme vous pouvez le voir dans le texte ci-dessus, déplacé de droite à gauche avec des timings différents, ils sont donc tous à des positions différentes.
Conclusion
Déplacement du texte en HTML réalisé par la balise marquee. Nous pouvons déplacer le texte à gauche, à droite, de haut en bas en fonction des besoins. Cette fonctionnalité phare est principalement utilisée par les cha?nes de télévision pour une mise à jour régulière afin de capter l'attention des utilisateurs.
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!

Outils d'IA chauds

Undress AI Tool
Images de déshabillage gratuites

Undresser.AI Undress
Application basée sur l'IA pour créer des photos de nu réalistes

AI Clothes Remover
Outil d'IA en ligne pour supprimer les vêtements des photos.

Clothoff.io
Dissolvant de vêtements AI

Video Face Swap
échangez les visages dans n'importe quelle vidéo sans effort grace à notre outil d'échange de visage AI entièrement gratuit?!

Article chaud

Outils chauds

Bloc-notes++7.3.1
éditeur de code facile à utiliser et gratuit

SublimeText3 version chinoise
Version chinoise, très simple à utiliser

Envoyer Studio 13.0.1
Puissant environnement de développement intégré PHP

Dreamweaver CS6
Outils de développement Web visuel

SublimeText3 version Mac
Logiciel d'édition de code au niveau de Dieu (SublimeText3)

L'image non affichée est généralement causée par un mauvais chemin de fichier, un nom ou une extension de fichier incorrect, des problèmes de syntaxe HTML ou un cache de navigateur. 1. Assurez-vous que le chemin SRC est cohérent avec l'emplacement réel du fichier et utilisez le chemin relatif correct; 2. Vérifiez si le cas de fichier et l'extension correspondent exactement et vérifiez si l'image peut être chargée en entrant directement l'URL; 3. Vérifiez si la syntaxe TAG IMG est correcte, assurez-vous qu'il n'y a pas de caractères redondants et que la valeur d'attribut ALT est appropriée; 4. Essayez de forcer l'actualisation de la page, de nettoyer le cache ou d'utiliser le mode incognito pour éliminer les interférences du cache. Le dépannage dans cet ordre peut résoudre la plupart des problèmes d'affichage d'image HTML.

?oucannotnesttagssisideanothertagbecauseit’sinvalidhtml; browsersautomatiquematethethefirstbeforeOpiningtheenxt, résultant de laparateParagraphs.

Pour créer une liste HTML non ordonnée, vous devez utiliser une balise pour définir un conteneur de liste. Chaque élément de liste est enveloppé d'une balise et le navigateur ajoutera automatiquement des balles; 1. Créez une liste avec une balise; 2. Chaque élément de liste est défini avec une balise; 3. Le navigateur génère automatiquement des symboles de points par défaut; 4. Les sublilistes peuvent être mis en ?uvre par le biais de la nidification; 5. Utilisez l'attribut de type de style liste de CSS pour modifier le style de symbole, tel que le disque, le cercle, le carré ou aucun; Utilisez ces balises correctement pour générer une liste standard non ordonnée.

THECONTANTITABLEATTRIBUTEMAKESANYHTMLEMéMéRITéBYADDING CONTANTITALLE = "VRUE", permettant à la réception de codomente detteurthebrowser.

SémantichtmlimprovesbothseoandaccessibilityByusing a été ultime

La balise Schema.org aide les moteurs de recherche à comprendre le format de données structuré du contenu de la page Web via des balises sémantiques (telles que la portée de l'élément, le type d'élément, ItemProp); Il peut être utilisé pour définir le vocabulaire personnalisé, les méthodes incluent l'extension des types existants ou l'utilisation de Type supplémentaire pour introduire de nouveaux types; Dans les applications réelles, en gardant la structure claire, en utilisant d'abord les attributs officiels, tester la validité du code et garantir que les types personnalisés sont accessibles; Les précautions comprennent l'acceptation de soutien partiel, d'éviter les erreurs d'orthographe et de choisir un format approprié tel que JSON-LD.

UsetheelementwithinatagtocreatEasanticsearchField.2. y comprisaForAccesssibility, settheform'sactionandMethod = "get" attributestosenddatatoesearchndpointwithAsharableArl.3.Addname = "Q" todefinetheQueryParameter, usePlaceHolderToguiseUd

rel = "Stylesheet" linkSsssFilesForSTylingThepage; 2.rel = "Preload" HintstopreloadCriticalResourcesForPerformance; 3.rel = "icon" setthewebsite’sfaviCon; 4.rel = "alternate" fournit la réversion desstiètes; 5.rel = & Qu
