Dem, der har skrevet HTML i lang tid, kan huske elementet. Dette var et browser-specifikt element, der oprettede et banner for at rulle tekst på tværs af skærmen. Dette element blev aldrig tilføjet til HTML-specifikationen, og støtten til det varierede bredt på tværs af browsere. Folk havde ofte meget stærke meninger om brugen af dette element - både positive og negative. Men om du elskede eller hadede det, tjente det formålet med at gøre indhold, der oversvømmede boksens grænser synlige.
En del af grunden til, at den aldrig blev fuldt implementeret af browsere, bortset fra stærk personlig mening, var, at det betragtes som en visuel effekt, og den bør derfor ikke defineres af HTML, som definerer strukturen. I stedet skal visuelle eller præsentationseffekter styres af CSS. Og CSS3 tilføjer markeringsmodulet til at kontrollere, hvordan browsere tilføjer markeringseffekten til elementer.
Nye CSS3 Egenskaber
CSS3 tilføjer fem nye egenskaber for at hjælpe med at kontrollere, hvordan dit indhold vises i markeringen: overflow-stil
, telt-stil
, lysavis-play-count
, telt-retningen
og telt-hastighed
.
Indstillingerne er Endelig springer alternativt indholdet fra side til side, glider frem og tilbage. Du skal muligvis bruge leverandørpræfikser for at få CSS markeringselementerne til at fungere. De er som følger: Den sidste egenskab giver dig mulighed for at definere, hvor stort eller lille trinene skal være, når indholdet ruller på skærmen i markeringen. For at få din markeringsramme til at fungere, bør du først sætte sælgerens præfikserede værdier og derefter følge dem med CSS3-specifikationsværdierne. For eksempel er her CSS for en markeringsramme, der ruller teksten fem gange fra venstre til højre inde i en 200x50 boks.overflow-stil
Det overflow-stil
ejendom (som jeg også diskuterede i artiklen CSS Overflow) definerer den foretrukne stil for indhold, der overlader indholdsboksen. Hvis du indstiller værdien til telt-line
eller telt-blok
dit indhold glider ind og ud til venstre / højre (telt-line
) eller op / ned (telt-blok
).telt-stil
Denne egenskab definerer, hvordan indholdet flyttes til visning (og ud).rulle
, glide
og skifte
. Scroll starter med indholdet helt ud af skærmen, og derefter bevæger det sig over det synlige område, indtil det er helt helt væk fra skærmen igen. Slide starter med indholdet helt ud af skærmen og derefter bevæger det sig over, indtil indholdet er fuldt flyttet på skærmen, og der er ikke mere indhold tilbage til at glide på skærmen.lysavis-play-count
En af ulemperne ved at bruge MARQUEE
element er, at marquee aldrig stopper. Men med stilegenskaben lysavis-play-count
Du kan indstille markeringen til at rotere indholdet til og fra for et bestemt antal gange.telt-retningen
Du kan også vælge den retning, som indholdet skal rulle på skærmen. Værdierne frem
og bagside
er baseret på retningen af teksten, når overflow-stil
er telt-line
og op eller ned, når overflow-stil
er telt-blok
.Marquee-Direction detaljer
overflow-stil
Sprogretning frem bagside telt-line
ltr venstre ret RTL ret venstre telt-blok
op ned telt-hastighed
Denne egenskab bestemmer, hvor hurtigt indholdet ruller på skærmen. Værdierne er langsom
, normal
, og hurtig
. Den faktiske hastighed afhænger af indholdet og browseren, der viser det, men værdierne skal være langsom
er langsommere end normal
hvilket er langsommere end hurtig
.Browser Support af Marquee Egenskaber
CSS3 Leverandørens præfiks overflow-x: marquee-line;
overflow-x: -webkit-marquee;
telt-stil
-webkit-telt-stil
lysavis-play-count
-webkit-telt-gentagelse
marquee-direction: forward | reverse;
-webkit-marquee-retning: fremad | tilbage;
telt-hastighed
-webkit-telt-hastighed
ingen ækvivalent -webkit-telt-tilvækst
{ bredde: 200px; højde: 50px; hvid-rum: nowrap; overløb: skjult; overflow-x: -webkit-marquee; -webkit-marquee-retning: fremad; -webkit-marquee-stil: scroll; -webkit-marquee-hastighed: normal; -webkit-marquee-increment: small; -webkit-marquee-repetition: 5; overflow-x: marquee-line; marquee-retning: fremad; marquee-style: scroll; marquee-speed: normal; marquee-play-count: 5;}