Heim >Web-Frontend >HTML-Tutorial >Beispielanalyse des Textumbruchs in HTML (HTML-Mischanordnung von Bildern und Text)

Beispielanalyse des Textumbruchs in HTML (HTML-Mischanordnung von Bildern und Text)

高洛峰
高洛峰Original
2017-03-06 16:19:382775Durchsuche

Wir wissen, wie man Text in Word umschließt, aber wie implementiert man ihn auf einer Webseite? Das ist nicht so einfach wie mit Worten. Aber solange Sie gute HTML-Elemente verwenden, können Sie diesen Effekt trotzdem erzielen. Im Allgemeinen gibt es verschiedene Arten des Umbruchs: Textumbruch um Bilder, Textumbruch um Text usw. Worüber ich sprechen möchte, sind diese beiden. Okay, fangen wir an

1. Textumbruch

Wenn wir zum Beispiel normale verwenden:

Der Code lautet wie folgt:

<TABLE cellpadding="15" width="200">
<TR>
<TD bgcolor="#EEEEFF"><IMG src="test.gif" hight=60>这里是普通的。国内的VB网站中vbgood以每日更新,资料量丰富,而深受程序爱好者的喜欢。</TD>
</TR>
</TABLE>

Wenn in einer solchen Aussage das Bild größer als der Text ist, wird über dem Text ein Leerzeichen angezeigt. Die Wirkung der Seite ist sehr schlecht. Wie kann man es lösen? Bitte schauen Sie sich diesen Code an:

Der Code lautet wie folgt:

<TABLE cellpadding="15" width="200">
<TR>
<TD bgcolor="#EEEEFF"><IMG src="test.gif" hspace="1" align="LEFT" hight=60>这里是绕排的。国内的VB网站中vbgood以每日更新,资料量丰富,而深受程序爱好者的喜欢。</TD>
</TR>
</TABLE>


Fügen Sie dieses Attribut zum img-Element hinzu, um das Problem zu lösen: align="center" , das Problem wird gelöst. Halten Sie es einfach! Hspace definiert die Breite des Bildes und der umgebenden Elemente. Es spielt keine Rolle, ob es umgangen wird oder nicht.

Wie wurde das gemacht? Schauen wir uns zunächst diesen Code an:

Der Code lautet wie folgt:

<table 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>在</b></font> </table>国内的VB网站中vbgood以每日更新,资料量丰富,而深受程序爱好者的喜欢。(End)</td></tr>
</table>


Wie erreicht man diesen Effekt?

Der Code lautet wie folgt:

<table 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>在</b></font>
</table>国内的VB网站中vbgood以每日更新,资料量丰富,而深受程序爱好者的喜欢。(End)</td></tr>
</table>


Dieser Code erklärt es auf einen Blick Ich möchte diese Tabelle vergrößern. Klicken Sie einfach darauf.

Aber was soll ich nun tun, wenn ich möchte, dass der Text eine Hintergrundfarbe hat? Ha, du bist so schlau, füge das bgcolor-Attribut zur Tabelle hinzu, so:

Der Code lautet wie folgt:

<table 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>在</b></font></table>国内的VB网站中vbgood以每日更新,资料量丰富,而深受程序爱好者的喜欢。(End)</td></tr></table>


Aber es geht es kam heraus? Nein, ich muss etwas hinzufügen (denken Sie daran, das nächste Mal nicht so schnell zu antworten:), etwa so:

Der Code lautet wie folgt:

<table 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>在</b></font></td></table>国内的VB网站中vbgood以每日更新,资料量丰富,而深受程序爱好者的喜欢。(End)</td></tr></table>

Mehr HTML-Implementierung Beispiele für Textumbruch (HTML-Mischgrafiken und -Text) Beispielartikel für die Analyse. Bitte beachten Sie die chinesische PHP-Website!

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