Lassen Sie Ihren Text mit dem Marquee-Attribut in HTML tanzen
|
Syntax: <marquee> …</marquee> Mithilfe des mobilen Attributs „Marquee“ können Sie Ihren Text nicht nur tanzen lassen, sondern auch auf Bilder, Tabellen usw. anwenden. <marquee direction=left>Willkommen beim Kexun Youth Learning Channel! </Festzelt> direction=left, gibt die Richtung an. Der Texteffekt oben lautet „Willkommen beim Kexun Youth Learning Channel!“ und bewegt sich von rechts nach links! Darüber hinaus sind die Richtungen rechts, oben und unten zu nennen. Neben der Richtung können wir weitere einschränkende Elemente hinzufügen: Fortbewegungsmöglichkeiten: Schleifenbewegung: loop = n (n gibt die Anzahl an) Kreisförmige Bewegung: behavior = scroll Nur einmalige Bewegung: behavior = slide Vor- und zurückbewegen: behavior = alternate Aussehen: Schriftgröße: <font size=n> (n, variabel) Ausrichtung: align=top/middle/bottom Hintergrundfarbe: bgcolor=Blue (vordefinierte Farben, wie: Schwarz, Oliv, Blaugrün, Rot, Blau, Kastanienbraun, Marineblau, Grau, Limettengrün, Fuchsia, Weiß, Grün, Lila, Silber, Gelb, Aquamarin oder Hexadezimalzahlen) andere: Geschwindigkeit: scrollmount=n(n, variabel) Verzögerung: scrolldelay==n(n, variabel) <marquee direction="Bewegungsrichtung" height="Höhe des Bewegungsbereichs" width="Breite des Bewegungsbereichs" scrollamount="Bewegungsgeschwindigkeit" onmouseover=this.stop() onmouseout=this.start()>" onmouseover stellt die Maus so ein, dass sie ihre Bewegung pausiert, wenn sie sich im Bewegungsbereich befindet onmouseout Weiter scrollen, wenn die Maus weggeht Verwenden Sie Laufschriftcode, um Text- und Bildlauf zu implementieren Heute habe ich die Einstellung für Lauftext auf TAP gesehen! Es scheint, dass es vorher nicht unterstützt wurde. Vielleicht habe ich es nicht benutzt! Haha, lass mich dir die Wirkung zeigen! Nachfolgend finden Sie eine Code-Erklärung des Scrolling Text Bulletin Boards von TAP Auswahlparameter: BGColor: Die Hintergrundfarbe des Lauftextfelds. Richtung: Einstellung der Scrollrichtung, Sie können zwischen links, rechts, oben und unten wählen. scrolldelay: Die Verzögerungszeit zwischen jedem Scrollen. Je größer der Wert, desto langsamer das Scrollen. scrollamount: Die Gesamtzeit für einen Bildlauf. Je kleiner die Zahl, desto langsamer der Bildlauf. Verhalten: Der Scrollmodus wird eingestellt. Es gibt drei mögliche Werte: Scroll (kreisförmiges Scrollen), Slide (einzelnes Scrollen) und Alternate (vor- und zurückscrollen). Ausrichten: Einstellungen für die Textausrichtung. Sie können zwischen „Mitte“, „Unten“ und „Oben“ wählen. Breite: Die Breite des scrollbaren Textfelds. Geben Sie einen Wert ein und wählen Sie über das Optionsfeld dahinter die Option in Pixeln oder Prozent aus. Höhe: Die Höhe des Scroll-Textfelds. Geben Sie einen Wert ein und wählen Sie über das Optionsfeld dahinter die Höhe in Pixeln oder Prozent aus. Schleife: Die Anzahl der Scrollvorgänge. Der Standardwert ist unendlich hspace, vspace: Leerzeilen davor und danach sowie darüber und darunter. Die folgende Demonstration ist meine Bulletin-Board-Demonstration: Sie können den Effekt in der unteren rechten Ecke sehen! Wenn es Dir gefällt! Kopieren Sie den Code und ersetzen Sie ihn im obigen Code, um den Effekt zu sehen! Effekt 1: Text scrollt nach oben Code kopieren Der Code lautet wie folgt:<Marquee Richtung="nach oben" Schleife="-1" Scrollamount="4"> <div ausrichten="links"> </div><center> <font color="#008000"></font></center><div align="left"> </div><center><p><font color="#ff6600">Site-Ankündigung</font></p> <p><font color="#ff4500">Willkommen bei Xiaojun Resources</font></p> <p><font color="#ff4500">Hier teilen wir mit Ihnen die neuesten kostenlosen Ressourcen und Informationen,</font></p> <p><font color="#ff4500">Ich hoffe, es gefällt Ihnen, Ihre Unterstützung ist meine größte Motivation!</font></p> <p><font color="#ff4500">Wenn Sie Vorschläge haben, lassen Sie es mich bitte wissen! </font></p> <p><font color="#ff4500">Die Ressourcen auf dieser Site stammen aus dem Internet, wenn sie Ihre Rechte verletzen! </font></p> <p><font color="#ff4500"></font></p> <font color="#ff4500"><p><font color="#ff3300">Danke für Ihre Unterstützung, Xiaojun ist dank Ihnen wunderbar</font> </p></font></center><font color="#ff4500"></font></marquee> Effekt 2: Text scrollt nach links <marquee direction="left" loop="-1">[Ankündigung] Einige Tutorials stammen ursprünglich von Tap Knows. Bitte geben Sie beim Nachdruck die Quelle an! </Festzelt> Bildlaufcode: Code kopieren Der Code lautet wie folgt:<marquee direction="lift" loop="-1" scrollamount="20" width="500" height="210"> <a href="http://jun51.tap.cn/" target="_blank"><img height="200" width="300" src="upload/2022/web/CC6169D8EE67719C4299B0740123325E.jpg"/><img height="200" width="300" src="upload/2022/web/EB965C39B9A8B63AE3908267DD6C45C8.jpg"/><img height="200" width="300" src="upload/2022/web/676E5C63EA319EEABCCB6D03C19121D4.jpg"/> </Festzelt> Fügen Sie einfach so viel hinzu, wie Sie möchten! Es scheint jedoch, dass beim Browsen einige Anzeigeeffekte auftreten! Ich schlage vor, Sie verwenden Google, es funktioniert großartig! |
>>: Detaillierte Erläuterung der Transaktionsisolationsebenen in den MySql-Studiennotizen
Artikel empfehlen
Mit JS einen rotierenden Weihnachtsbaum in HTML implementieren
<!DOCTYPE HEML PUBLIC> <html> <Kop...
Anleitung zur Verwendung von env in vue cli
Inhaltsverzeichnis Vorwort Einführung-Offiziell B...
So konvertieren Sie zusätzlichen Text in HTML in Auslassungspunkte
Wenn Sie zusätzlichen Text in HTML als Auslassung...
So implementieren Sie Funktions-Currying und -Decurrying in Javascript
Funktion Currying (schwarzes Fragezeichen)? ? ? C...
So implementieren Sie die automatische Ansible-Installation und -Konfiguration von httpd im Linux-System
1. Verwenden Sie das Playbook von Ansible, um htt...
Implementierung der Anmeldeseite des tatsächlichen Kampfprotokolls von Vue
Inhaltsverzeichnis 1. Vorbereitende Maßnahmen 1.1...
Welche Ähnlichkeiten gibt es zwischen der Entwicklung des Webdesigns und der westlichen Architektur?
Die Geschichte wiederholt sich immer überraschend...
5 Tipps zum Schreiben von CSS, um Ihren Stil standardisierter zu gestalten
1. CSS alphabetisch ordnen Nicht in alphabetischer...
Sammlung von 12 praktischen Web-Online-Tools
1. Favicon.cc Um ICO-Symbol-Websites online zu er...
Detaillierte Erklärung der drei Möglichkeiten zum Umbrechen von Text in der El-Table-Kopfzeile
Inhaltsverzeichnis Problembeschreibung Rendern Dr...
Beispiel für eine Formatierungsmethode für Datum und Uhrzeit in js
js Datums-/Zeitformat Konvertieren Sie Datum und ...
Verwenden Sie die Triggermethode, um ein Popup-Dialogfeld zur Dateiauswahl zu realisieren, ohne auf die Dateitypeingabe klicken zu müssen
Sie können die Trigger-Methode verwenden. In JavaS...
Speicher-Engine und Protokollbeschreibung basierend auf MySQL (ausführliche Erklärung)
1.1 Einführung in Speicher-Engines 1.1.1 Dateisys...
Mit CSS3 wird ein Kegelschnitt-Gradienteneffekt erzielt
Grammatik: Hintergrundbild: Kegelschnitt-Farbverl...
Erklärung zur Verwendung der beiden in Element-ui integrierten Remote-Suchen (Fuzzy-Abfragen)
Problembeschreibung Es gibt einen Abfragetyp name...