Heim  >  Artikel  >  Web-Frontend  >  HTML-Einsteigerhandbuch (8)

HTML-Einsteigerhandbuch (8)

黄舟
黄舟Original
2016-12-23 14:46:521093Durchsuche


In Zeilen eingebettete Bilder
Die meisten Webbrowser können Bilder im X-Bitmap- (XBM), GIF- oder JPEG-Format (d. h. Bilder neben Text) anzeigen, die in Zeilen eingebettet sind. Andere Formate Bilder werden in Webbrowser integriert [z. B. Portable Network Graphic (PNG)-Format]. Jedes Bild benötigt Verarbeitungszeit und verlangsamt die Anzeige des Dokuments.

enthält ein eingebettetes Bild Geben Sie in einer Zeile Folgendes ein:


ALT="FORWARD" HEIGHT=32 WIDTH=32>

wobei der Bildname ist ist die URL der Bilddatei.

Das Syntaxformat der URLs ist das gleiche wie das von der Ankerkette HREF verwendete Format Der Name des Bildes muss mit .gif enden. Dateien im X-Bitmap-Format müssen mit .xbm enden; Portable Network Graphic-Dateien müssen mit .png enden Bildgrößenattribut
Im -Tag sollten Sie zwei weitere Attribute einfügen, um dem Browser zusammen mit dem Text die Größe des heruntergeladenen Bildes mitzuteilen ) für das Bild, während Sie den Rest der Datei herunterladen (Sie können die Pixelgröße von Ihrer Bildverarbeitungssoftware wie Adobe Photoshop erhalten.)

Um beispielsweise ein Porträt von Ihnen in die Datei aufzunehmen, geben Sie ein :


ALT=" FORWARD" HEIGHT=32 WIDTH=32>

Hinweis : Wenn die Bildgröße nicht mit der Attributbeschreibungsgröße übereinstimmt, verwenden einige Browser die HEIGHT- und WIDTH-Attribute, um ein Bild zu vergrößern oder zu verkleinern, damit es für die Zuweisung von Speicherplatz geeignet ist. Daher ist dies nicht der Fall Gehen Sie davon aus, dass Ihre Leser diese Funktion bei der Planung nutzen können.

Bildpositionierung
Sie haben eine gewisse Flexibilität bei der Darstellung der Bilder Sie können Bilder vom Text trennen, Bilder links, rechts oder in der Mitte platzieren. Oder Sie können Bilder und Text getrennt halten. Der Text befindet sich in derselben Zeile. Sie können verschiedene Formen ausprobieren, um herauszufinden, welche am besten funktioniert

Bild und Text in derselben Zeile platzieren
Standardmäßig werden der untere Rand des Bildes und der folgende Text in derselben Zeile angezeigt, genau wie The Sie können das Bild auch oben oder in der Mitte eines Absatzes platzieren, indem Sie den Wert des ALIGN=-Attributs auf TOP oder CENTER setzen.

Dieser Text befindet sich in derselben Zeile wie der obere Teil des Bildes (). Beachten Sie, dass nur eine Textzeile so ist, die anderen Zeilen Springe zum unteren Rand des Bildes.

Diese Textzeile wird in der Mitte des Bildes angezeigt (). wird in der Mitte angezeigt und die anderen Zeilen befinden sich unter dem Bild.
Bild ohne Text
Wenn Sie ein Bild ohne Text anzeigen möchten (z. B. das Logo Ihrer Organisation), zeigen Sie es einfach als an Separater Absatz. Verwenden Sie das ALIGN=-Attribut des Absatz-Tags. Passen Sie das Bild an die Mitte oder rechte Seite des Fensters an, wie unten gezeigt:




Das Bild wird in der Mitte angezeigt; der Absatz beginnt links darunter >
Alt-Text für das Bild
Einige World Wide Web-Browser – hauptsächlich diejenigen, die auf VT100-Terminals ausgeführt werden – können das Herunterladen von Bildern nicht anzeigen, obwohl ihre Software Bilder anzeigen kann (insbesondere, wenn sie sich auf einem befinden). Benutzer eines Modems oder einer langsamen Leitung). HTML bietet den Lesern einen Mechanismus, mit dem sie erkennen können, was auf der angezeigten Seite fehlt eines Bildes. Zum Beispiel:

Up
ALT="" HEIGHT=48 WIDTH=50>

wobei UpArrow.gif ein Aufwärtspfeil ist. In Browsern mit Bildanzeigefunktionen und aktiviertem Bilddownload wird eine Aufwärtspfeilgrafik angezeigt. Im VT100-Browser oder wenn das Herunterladen von Bildern deaktiviert ist, wird das Wort „Up“ in Ihrem Fenster angezeigt.

Sie sollten für jedes Bild, das in Ihrem Dokument angezeigt wird, einen Ersatztext verwenden 🎜>
Hintergrundbild
Neuere Versionen von Webbrowsern können ein Bild herunterladen, um es als Hintergrund für die Anzeige einer Homepage zu verwenden Sie möchten sicherstellen, dass Ihr Text vor dem Hintergrund noch deutlich lesbar ist.

Das Hintergrundbild kann ein Stoffobjekt (z. B. Leinenpapier) oder ein Bild (vielleicht ein Logo) sein Bild genau wie jedes andere Bild.

Sie müssen jedoch nur ein sehr kleines Bild erstellen. Der Browser verwendet eine Funktion namens Kacheln, um das Bild wiederholt anzuzeigen und das gesamte Browserfenster auszufüllen. Einfach ausgedrückt: Sie erstellen einfach ein Bild und der Browser führt dies automatisch mehrmals durch, bis es Ihr Fenster ausfüllt. Diese Aktion wird automatisch ausgeführt, wenn Sie das unten beschriebene Tag verwenden. Das Tag, das das Hintergrundbild enthält, ist als Attribut in der Tag-Beschreibung enthalten „Dateiname.gif“> Textfarbe.

Überprüfen Sie unbedingt vorab, ob diese Änderung noch gut lesbar ist (Viele verwenden beispielsweise roten Text auf schwarzem Hintergrund, der sehr schwer zu lesen ist!)

Mithilfe der verschiedenen Attribute des können Sie die Farbe von Text, Links, angezeigten Links und aktiven Links ändern. Geben Sie beispielsweise Folgendes ein:

erstellt ein Fenster mit schwarzem Hintergrund (BGCOLOR), weißem Text (TEXT) und silbernen Hyperlinks (LINK). > Eine sechsstellige Kombination aus Zahlen und Buchstaben stellt eine Farbe dar, die den RGB-Wert (Rot, Grün, Blau) einer bestimmten Farbe angibt. Diese sechsstellige Zahl besteht eigentlich aus drei nacheinander angeordneten zweistelligen Zahlen, die den Ausgangspunkt darstellen . Hexadezimale Werte der Rot-, Grün- und Blauanteile von 00 bis FF. Beispielsweise bedeutet 000000 Schwarz (überhaupt keine Farbe), FF0000 ist leuchtendes Rot und FFFFFF ist Weiß (alle drei Farben gesättigt). Glücklicherweise gibt es eine Online-Ressource, die Ihnen helfen kann Verstehen Sie die Beziehung zwischen verschiedenen Kombinationen und Farben:

ColorPro-Webserver
Externe Bilder, Töne und Animationen
Vielleicht möchten Sie wissen, wann der Benutzer beim Erstellen ein Wort oder ein kleines Bild in Ihrem Dokument aktiviert Wenn Sie einen Link hinzufügen, öffnen Sie ein Bild als separates Dokument. Dies wird als externes Bild bezeichnet und ist nützlich, wenn Sie die Download-Geschwindigkeit des Hauptdokuments nicht aufgrund eines großen Bilds verlangsamen möchten Geben Sie zu einem externen Bild Folgendes ein:

Link-Anker Sie können auch ein kleines Bild verwenden, das als Link zu fungiert ein größeres Bild. Geben Sie ein:

48 WIDTH=50>

Leser sehen das Bild SmallImage.gif und klicken darauf, um die Datei LargerImage.gif zu öffnen.

Verwenden Sie dieselbe Syntax für Links, externe Animationen und Sounds ist die Erweiterung der verknüpften Datei. Zum Beispiel:

link Anchor Das Obige ist der Inhalt des HTML-Anfängerleitfadens (8). Weitere verwandte Inhalte finden Sie auf der chinesischen PHP-Website (www.php.cn).




Stellungnahme:
Der Inhalt dieses Artikels wird freiwillig von Internetnutzern beigesteuert und das Urheberrecht liegt beim ursprünglichen Autor. Diese Website übernimmt keine entsprechende rechtliche Verantwortung. Wenn Sie Inhalte finden, bei denen der Verdacht eines Plagiats oder einer Rechtsverletzung besteht, wenden Sie sich bitte an admin@php.cn
Vorheriger Artikel:HTML-Einsteigerhandbuch (7)Nächster Artikel:HTML-Einsteigerhandbuch (7)