De av dere som har skrevet HTML i lang tid, kan huske elementet. Dette var et nettleserespesifikt element som opprettet en banner av rullende tekst på tvers av skjermen. Dette elementet ble aldri lagt til HTML-spesifikasjonen, og støtten til det varierte mye over nettlesere. Folk hadde ofte veldig sterke meninger om bruken av dette elementet - både positivt og negativt. Men om du elsket eller hatet det, tjente det formålet med å lage innhold som overgikk boksens grenser synlige.
En del av grunnen til at den aldri ble fullt implementert av nettlesere, bortsett fra sterk personlig mening, var at det regnes som en visuell effekt, og det bør derfor ikke defineres av HTML, som definerer strukturen. I stedet bør visuelle eller presentasjonseffekter administreres av CSS. Og CSS3 legger til marquee-modulen for å kontrollere hvordan nettlesere legger til marquee-effekten til elementer.
Nye CSS3 egenskaper
CSS3 legger til fem nye egenskaper for å kontrollere hvordan innholdet ditt vises i teltet: flow-stil, telt-stil, Marquee-play-count, telt-retningen og telt-speed.
Alternativene er Til slutt spretter alternativet innholdet fra side til side, og skyver frem og tilbake. Du må kanskje bruke leverandørprefikser for å få CSS-markeringselementene til å fungere. De er som følger: Den siste egenskapen lar deg definere hvor stor eller liten trinnene skal være når innholdet ruller på skjermen i teltet. For å få markeringen din til å fungere, bør du først sette leverandørens forhåndsdefinerte verdier og deretter følge dem med CSS3-spesifikasjonsverdiene. For eksempel, her er CSS for en markering som ruller teksten fem ganger fra venstre til høyre i en 200x50 boks.flow-stilDe flow-stil eiendom (som jeg også diskuterte i artikkelen CSS Overflow) definerer den foretrukne stilen for innhold som overløper innholdsruten. Hvis du setter verdien til telt-linje eller telt-blokk innholdet ditt vil skyve inn og ut til venstre / høyre (telt-linje) eller opp / ned (telt-blokk).telt-stilDenne egenskapen definerer hvordan innholdet vil bevege seg til visning (og ut).bla, lysbilde og alternere. Scroll starter med innholdet helt av skjerm, og deretter beveger det seg over det synlige området til det er helt helt uten skjerm igjen. Slide starter med innholdet helt av skjerm og deretter beveger det seg over til innholdet er fullt flyttet på skjermen, og det er ikke mer innhold igjen å skyve på skjermen.Marquee-play-countEn av ulempene med å bruke Marquee elementet er at teltet stopper aldri. Men med stilegenskapen Marquee-play-count Du kan angi teltet for å rotere innholdet på og av for et bestemt antall ganger.telt-retningenDu kan også velge retningen som innholdet skal rulle på skjermen. Verdiene framover og omvendt er basert på retningen av teksten når flow-stil er telt-linje og opp eller ned når flow-stil er telt-blokk.Marquee-Direction Detaljer
flow-stilSpråkretning framover omvendt telt-linjeltr venstre Ikke sant RTL Ikke sant venstre telt-blokk opp ned telt-speedDenne egenskapen bestemmer hvor raskt innholdet ruller på skjermen. Verdiene er langsom, normal, og rask. Den faktiske hastigheten avhenger av innholdet og nettleseren som viser det, men verdiene må være langsom er tregere enn normal som er tregere enn rask.Nettleserstøtte for Marquee-egenskapene
CSS3 Leverandørens prefiks overløp-x: marquee-line;overflow-x: -webkit-marquee;telt-stil-webkit-telt-stilMarquee-play-count-webkit-telt-repetisjonmarquee-direction: forward | revers;-webkit-marquee-retning: fremover | bakover;telt-speed-webkit-telt-speedingen tilsvarende -webkit-telt-økning{ bredde: 200px; høyde: 50px; hvit-rom: nowrap; overløp: skjult; flow-x: -webkit-telt; -webkit-marquee-retning: fremover; -webkit-marquee-stil: bla; -webkit-marquee-speed: normal; -webkit-marquee-økning: liten; -webkit-marquee-repetisjon: 5; overløp-x: marquee-line; marquee-retning: fremover; Markiser-stil: bla; Markeringshastighet: normal; telt-play-count: 5;}
