Die Aufkleber (oder Band) sind jene Bilder, die sich in der oberen rechten oder linken oberen, und sie bilden gemeinsam eine Band Winkel. Es gibt verschiedene Arten, von einfachen statischen Bilder zu den schönsten Flash-Filme. Manchmal sind sie so konzipiert, bleiben in ihrer Position, auch wenn navigieren Sie den Inhalt Ihres Browser-Fenster.
Wenn Sie nicht möchten, dass hoheitliche eine Dienstleistung im QuickRibbon.com, wollen aber, dass zum Aufbau einer Band ganz Ihnen, hier gibt 3 einfachen Schritten zu folgen.
1. Wir schaffen das Bild
Zunächst schaffen wir das Bild, das wir setzen wollen in einer Ecke, rechts oder links. Das Bild unten, bis 163x163 Pixel, ecostruita auf der linken oberen Ecke.

Um die Wirkung vollständig überschneiden müssen wählen, die zum Zeitpunkt der Rettungs-, ein Format, unterstützt die Transparenz, wie GIF oder PNG.
2. Der HTML-Code
Gespeicherte unser Bild haben wir in unserer Seite, einwickelung dem Tag img mit einem div die Sie verwenden können, um das Bild in:
HTML: > <img src = "ribbon.gif" title = "Ribbon Test" width = "163" height = "163" border = "0" > </div> <div "ribbon" Klasse => <img src = "ribbon.gif" title = "Ribbon Test" width = "163" height = "163" border = "0"> </ div>
Wenn unsere Aufkleber muss ein Link, wir Gebrauch machen können von dem Tag map um einen sensiblen Bereich, die nicht rechteckig. Die Aufkleber, die in diesem Beispiel, in der Tat, Sie haben ein schräg und Transparenz hebt die Konturen perfekt. Es wäre daher unsachgemäße zu ermöglichen, klicken Sie auf einen leeren Bereich, indem Sie einfach ein a das Bild Introns. Dann benutzen wir diese Syntax:
HTML: > <img src = "ribbon.gif" title = "Ribbon Test" width = "163" height = "163" border = "0" usemap = "#ribbonlink" > </div> <div "ribbon" Klasse => <img src = "ribbon.gif" title = "Ribbon Test" width = "163" height = "163" Grenze usemap = "0" = "#ribbonlink"> </ div> > <area shape = "poly" coords = "163,0,0,163,0,129,129,0" href = "http://undolog.com" > </map> <map "ribbonlink" Namen => <area Form = "poly" coords = "163,0,0163,0129129,0" href = "http://undolog.com"> </ map>
Das Attribut coords area definiert die Koordinaten unserer Band.
3. die CSS
Jetzt fügen wir die Definitionen der Stile, durch die die Aufkleber von unserer Position auf der Seite richtig:
CSS: div.ribbon (
; position: absolute;
top: 0px; left: 0px;
height: 163px; width: 163px;
;padding: 0 ; margin: 0; padding: 0;
; overflow: sichtbar;
; float: none;
} z-index: 10000)
div.ribbonimg (
;padding: 0 ;margin: 0 ; border: 0; padding: 0; margin: 0;
} background-image: none)
Wenn wir wollen, dass die Band nach wie vor "appiccicato", um das Video, auch wenn Scrollen Sie das Fenster, einfach ändern die Art absolute Stil position
CSS: div.ribbon (
; Position: Festnetz;
top: 0px; left: 0px;
height: 163px; width: 163px;
;padding: 0 ; margin: 0; padding: 0;
; overflow: sichtbar;
; float: none;
} z-index: 10000)
Hinweis: die Art fixed in der Art position bis vor kurzem wurde nicht von allen Browsern unterstützt. Um die Wirkung, in der Tat, es war gezwungen, eine Javascript-Funktion, dass in regelmäßigen Abständen kontrolliert die Strömung von Inhalten des Fensters und Neupositionierung der Band, den Eindruck zu erwecken bleiben im Wesentlichen unbeweglich. Zum Glück, heute, mit einigen veralteten Version von Explorer, von allen Browsern unterstützt die Art fixed
Verwandte Post