Conseils utiles

Comment faire une ligne rampante sur le site

Pin
Send
Share
Send
Send


Avez-vous déjà vu le mouvement brusque de défilement de texte sur un site Web? Vous êtes-vous déjà demandé comment cela se faisait? Vous n'avez pas besoin de chercher des informations ailleurs! Ce texte défilant s'appelle un chapiteau. Il peut être fabriqué dans n'importe quelle couleur, dans n'importe quelle direction, et bien plus encore. Voir l'étape 1 ci-dessous pour commencer!

  1. 1 Ouvrez le document HTML si ce n'est déjà fait.
  2. 2 Placez ce code à l'endroit où vous souhaitez placer le chapiteau:
  3. 3 Sélectionnez une couleur d'arrière-plan. Vous pouvez modifier l'arrière-plan de la ligne de recul en spécifiant une valeur hexadécimale (HEX) ou une valeur RVB (rouge-vert-bleu) après la partie "background-color:" du code (couleur d'arrière-plan). La valeur par défaut ci-dessus, # 000080, est bleu marine couleur Une liste complète des couleurs et leur signification peuvent être trouvées.
  4. 4 Définissez la direction de défilement. Changer d'attribut direction dans le code des éléments suivants: droite (de gauche à droite), gauche (de droite à gauche (par défaut)), haut (de bas en haut) ou bas (de haut en bas).
  5. 5 Indiquez le nombre de cycles d'exécution de la ligne rampante. Attribut boucle peut être modifié en fonction des besoins - il contrôle le nombre de fois que la ligne rampante doit être déplacée. Si vous voulez qu'il bouge continuellement, abaissez-le.
  6. 6 Spécifiez le texte de la ligne rampante. Le texte à l'intérieur de la balise et la balise feront défiler le texte sur la ligne rampante. Ecrivez ce que vous voulez afficher.
  7. 7 Définissez la couleur du texte. Ajouter un attribut style cadran intérieur
  • Voici un code de défilement de ligne rampante simple:

Ceci est une ligne de défilement.

  • Les lignes d’exploration sur les sites sont généralement un peu gênantes.
  • Faites attention lorsque vous modifiez les attributs de la ligne rampante.

Ligne rampante sur HTML. Bases HTML pour les débutants. Leçon numéro 9

Bonjour tout le monde!
Continuer à apprendre les bases du HTML.
Dans cette leçon, je vais raconter et enseigner comment faire une ligne rampante dans un document HTML. C'est une sorte d'animation primitive sur un site web sans l'utilisation d'éditeurs graphiques.
Une ligne rampante peut être utilisée pour afficher des actualités, des promotions, un message publicitaire et même pour de beaux moments de design (par exemple: un nuage dans le ciel se déplace dans l'en-tête d'un site). Je pense que vous trouverez vous-même l’application d’une ligne courante sur votre site, et j’ai maintenant pour tâche de vous expliquer comment cela se passe et comment il se présente dans la pratique.
Pour créer une ligne rampante, utilisez la balise:

* attributs pour la ligne rampante
couleur de fond du chapiteau
Pour colorer l'arrière-plan de la ligne courante, ajoutez l'attribut «bgcolor» à la balise «marquee»:

Résultat:
Ligne rampante

○ hauteur et largeur d'une ligne courante
Pour définir la hauteur et la largeur de la ligne rampante, ajoutez les attributs "width" et "height" à la balise de sélection:

○ comportement de la ligne rampante
Ajoutez l'attribut «behavior» à la balise de sélection avec les valeurs suivantes:

scroll - scroll normal (par défaut),

slide - la ligne commence par un bord et s'arrête à l'autre,

alterne - la ligne se déplacera d'un bord à l'autre

défilement normal (par défaut)

La ligne rampante traversera un bord et s'arrêtera à un autre

la ligne se déplacera d'un bord à l'autre

○ direction de la ligne de fuite
Ajoutez l'attribut direction avec les valeurs suivantes à la balise de sélection:

left - déplace le texte vers la gauche (par défaut),

right - déplace le texte vers la droite,

up - mouvement du texte de bas en haut,

down - mouvement du texte de haut en bas

déplacer le texte vers la gauche (par défaut)

mouvement du texte à droite

mouvement du texte de bas en haut

mouvement de texte de haut en bas

○ vitesse de ligne rampante
Pour ajuster la vitesse de déplacement de la ligne rampante, ajoutez l'attribut scrollamount à la balise de sélection:

Plus la valeur est grande, plus la vitesse est grande.

○ délai de ligne rampante
Un autre attribut avec lequel vous pouvez ajuster la vitesse. Plus la valeur est élevée, plus la vitesse est faible. Ajoutez l'attribut scrolldelay à la balise de sélection:

○ nombre de ticks
Si vous devez spécifier un certain nombre de passes de ligne de fuite, ajoutez l'attribut de boucle à la balise de sélection:

Dans l'exemple, la valeur est «2», ce qui signifie qu'il n'y aura que deux passes.

○ retraits rampants
Si vous devez spécifier l'indentation sur les côtés gauche et droit, ajoutez l'attribut «hspace» à la balise de sélection:

Comment insérer une image dans une ligne rampante

Pour insérer une ligne rampante dans une image, insérez une étiquette que vous connaissez déjà entre les étiquettes pour afficher l'image:


Tous les attributs de la balise sont également valables dans ce cas.

Attributs et paramètres

1. w - définit la largeur de la ligne courante en pixels / pourcentage. Ceux qui sont familiers avec le langage HTML sont probablement familiers avec cet attribut. Par exemple:

  • w - définit la largeur à 40% en fonction de la largeur du bloc dans lequel se trouve l'objet,

2. height = "number / percent" - définit la hauteur de la ligne courante en pixels / pourcentage. Un exemple peut être identique à celui du premier attribut. Par exemple:

  • height = "400px" - définit la hauteur à 400 pixels,
  • height = "30%" - définit la hauteur à 30% en fonction de la hauteur du bloc où se trouve l'objet,

Remarque: si la ligne rampante est composée d'une seule ligne, la hauteur peut être omise, car elle sera automatiquement déterminée en fonction de la taille de la police, définie par le paramètre font-size: Npx.

3. bgcolor = "color" - définit la couleur d'arrière-plan du conteneur. Vous pouvez choisir une couleur sur la page: codes de couleur html. Remarque: si l'attribut bgcolor n'est pas défini, l'arrière-plan sera la couleur d'arrière-plan de la page.

4. behavior = "paramètre" - c'est l'un des attributs les plus importants de la ligne en cours d'exécution. Il définit le comportement de la ligne rampante. Il a plusieurs options différentes:
• alterne - la ligne courante se déplace de manière cyclique: de droite à gauche, puis de gauche à droite (entre les bords). Par exemple:

Et si cette ligne regarde sur le site:

• scroll - la ligne rampante se déplace en dehors de la zone dans la direction indiquée par l'attribut direction (avec le paramètre), puis se répète par cycles. À mon avis, cette option est la plus courante. Par exemple:

5. direction = "paramètres" - définit la direction du mouvement de la ligne de fluage. Il peut prendre les valeurs suivantes:
• vers le bas - mouvement de haut en bas. Par exemple:

6. hspace = "number" - définit l'indentation de la ligne horizontale sur d'autres objets. La balise img populaire a un attribut similaire.

7. vspace = "number" - définit le retrait vertical sur d'autres objets.

8. loop = "number" - combien de fois vous avez besoin de faire défiler le contenu. Le paramètre spécifie un nombre, qui définit le nombre de répétitions. Remarque: -1 signifie une boucle de défilement infinie. La valeur par défaut est -1.

9. scrollamount = "number" - la vitesse de la ligne en mouvement. Le nombre définit le nombre de pixels par lequel l'objet se déplace en un seul cycle d'horloge. Remarque: la vitesse par défaut est de 6 pixels / s. Par exemple:

10. scrolldelay = "number" - définit le délai entre les étapes de la ligne rampante en millisecondes. Par exemple:

En fin de compte, je donnerai deux exemples d'utilisation de lignes rampantes. Exemple utilisant un objet div:

Regarde la vidéo: INFO-KAI - YO-KAI WATCH 4 EN FRANCE ? YO-KAI WATCH 1 REMAKE SUR NINTENDO SWITCH ?! (Octobre 2020).

Pin
Send
Share
Send
Send