Beispiel für die Implementierung von Textumbruch in HTML (gemischter Text und Bilder in HTML)
|
1. Text rund um das Bild Wenn wir zum Beispiel die normale Version verwenden: Code kopieren Der Code lautet wie folgt:<Tabelle cellpadding="15" width="200"> <TR> <TD bgcolor="#EEEEFF"><IMG src="test.gif" hight=60>Hier ist das normale. Unter den inländischen VB-Websites wird vbgood täglich aktualisiert, bietet umfangreiche Informationen und ist bei Programmierbegeisterten sehr beliebt. </TD> </TR> </TABLE> Wenn in einem solchen Satz das Bild höher als der Text ist, entsteht über dem Text ein Leerraum. Die Seitenperformance ist sehr schlecht. Wie kann man das Problem lösen? Bitte schauen Sie sich diesen Code an: Code kopieren Der Code lautet wie folgt:<Tabelle cellpadding="15" width="200"> <TR> <TD bgcolor="#EEEEFF"><IMG src="test.gif" hspace="1" align="LEFT" hight=60>Hier ist ein Wraparound-Layout. Unter den inländischen VB-Websites wird vbgood täglich aktualisiert, bietet umfangreiche Informationen und ist bei Programmierbegeisterten sehr beliebt. </TD> </TR> </TABLE> Das Problem kann gelöst werden, indem dem img-Element dieses Attribut hinzugefügt wird: align="center". Einfach, oder? hspace definiert die Breite des Bildes und der umgebenden Elemente. Dabei ist es egal, ob es verpackt ist oder nicht. Wie wurde das gemacht? Schauen wir uns zunächst diesen Code an: Code kopieren Der Code lautet wie folgt:<Tabelle align=left cellspacing=0 cellpadding=0 width=200 border=1> <tr> <td><table align=left cellspacing=0 cellpadding=0><font color=red size="5"><b>Unter den </b></font> </table> inländischen VB-Websites wird vbgood täglich aktualisiert, bietet umfangreiche Informationen und ist bei Programmierbegeisterten sehr beliebt. （Ende）</td></tr> </Tabelle> Wie erreicht man einen solchen Effekt? Code kopieren Der Code lautet wie folgt:<Tabelle align=left cellspacing=0 cellpadding=0 width=200 border=1> <tr> <td><table align=left cellspacing=0 cellpadding=0><font color=red size="5"><b>Alle</b></font> </table>Unter den inländischen VB-Websites wird vbgood täglich aktualisiert, bietet umfangreiche Informationen und ist bei Programmierbegeisterten sehr beliebt. （Ende）</td></tr> </Tabelle> Dieser Codeausschnitt erklärt es. Sie als kluge Person werden es auf den ersten Blick erkennen. Tragen Sie einfach die Wörter, die Sie vergrößern möchten, in diese Tabelle ein. Was aber ist, wenn ich dem Text eine Hintergrundfarbe verleihen möchte? Ha, du bist so schlau. Füge der Tabelle das Attribut bgcolor wie folgt hinzu: Code kopieren Der Code lautet wie folgt:<Tabelle align=left cellspacing=0 cellpadding=0 width=200 border=1> <tr> <td><table align=left cellspacing=0 cellpadding=0 bgcolor=#C0C0C0><font color=red size="5"><b>Unter den </b></font></table> inländischen VB-Websites wird vbgood täglich aktualisiert, bietet umfangreiche Informationen und ist bei Programmierbegeisterten sehr beliebt. （Ende）</td></tr></table> Aber kannst du rauskommen? Nein, es gibt noch etwas hinzuzufügen (denk daran, das nächste Mal nicht so schnell zu antworten :)), und zwar Folgendes: Code kopieren Der Code lautet wie folgt:<Tabelle align=left cellspacing=0 cellpadding=0 width=200 border=1> <tr> <td><table align=left cellspacing=0 cellpadding=0 bgcolor=#C0C0C0><td><font color=red size="5"><b>Unter den </b></font></td></table> inländischen VB-Websites wird vbgood täglich aktualisiert, bietet umfangreiche Informationen und ist bei Programmierbegeisterten sehr beliebt. （Ende）</td></tr></table> |
<<: So lösen Sie das Problem des Randkollapses in CSS
Artikel empfehlen
JS-Funktionsaufruf, Anwenden und Binden einer superdetaillierten Methode
Inhaltsverzeichnis JS-Funktionsaufruf, Apply- und...
Eine kurze Zusammenfassung von Vue Keep-Alive
1. Funktion Wird hauptsächlich verwendet, um den ...
Detaillierte Erklärung des HTML-Seitenkopfcodebeispiels
Wissenspunkt 1: Legen Sie die Basis-URL der Webse...
Detaillierte Erklärung der Schritte zum Erstellen eines Vue-Projekts mit Vue-cli
Zuerst müssen Sie Vue-cli installieren: npm insta...
So verwenden Sie Nginx zum Erstellen eines statischen Ressourcenservers
Nehmen wir Windows als Beispiel. Bei Linux ist es...
CSS wählt das erste untergeordnete Element unter dem übergeordneten Element aus (:first-child)
Vorwort Ich habe vor Kurzem :first-child in einem...
Erfahrungsaustausch zur Reparatur von MySQL InnoDB-Ausnahmen
Eine Reihe von MySQL-Bibliotheken zum Testen. Die...
Beispiel zum Anzeigen und Ändern der MySQL-Transaktionsisolationsebene
Überprüfen Sie die Transaktionsisolationsebene In...
40 CSS/JS-Stil und funktionale technische Verarbeitung
1- Dropdown-Auswahlfelder gestalten – Ändern Sie ...
Detaillierte Erläuterung der Anwendung von Meta-Tags bei der Entwicklung mobiler Plattformen
Jeder kennt das Meta-Tag im Weblayout von Desktop...
So installieren Sie Android x86 in einer virtuellen VMware-Maschine
Manchmal möchten Sie eine App testen, aber nicht ...
Detaillierte Erklärung des Java-Aufrufs von ffmpeg zum Konvertieren des Videoformats in flv
Detaillierte Erklärung des Java-Aufrufs von ffmpe...
So installieren Sie die Standalone-Version von Spark in einer Linux-Umgebung ohne Verwendung von Hadoop
Das Thema Big Data wird immer wichtiger und wer m...
Tutorial zum Ändern von Inline-Stilen von element.style
Vorwort Als wir den Stil der Webseite oben geschr...
Detaillierte Erklärung der Datenmengen von Docker-Containern
Was ist Schauen wir uns zunächst das Konzept von ...