Heim >Web-Frontend >CSS-Tutorial >Code zur Verwendung von CSS zur Lösung des Problems des Textumbruchs beim Austausch von images_Experience
Das Bild oben ist eine Liste von Nachrichtentiteln mit Bildern und Text, die von einem Künstler für eine Website erstellt wurden. Der obere und untere rechte Teil sind in zwei Zellen verteilt. Das Programm ist nicht einfach zu implementieren: entweder zweimal abfragen, einmal 4 Elemente abrufen und einmal 5 Elemente abrufen oder 9 Elemente auf einmal abrufen und in zwei Zellen anzeigen. Ist es möglich, die Bildeigenschaften so einzustellen, dass Text und Bilder wie in Word aneinander ausgerichtet werden können? Auf diese Weise muss das Programm nicht auf das Bild achten und ist nur dafür verantwortlich, es einmal zu lesen und anzuzeigen. Nach dem Testen kann das Setzen des Float-Attributs des Bildes auf links unser Problem lösen. Der Effekt ist wie folgt:
<div align="left"><img src=/upload/20071208230527665.gif width="91" height="84" style="float:left;" /> ·新闻标题列表<br> ·新闻标题列表<br> ·新闻标题列表<br> ·新闻标题列表<br> ·新闻标题列表新闻标题列表<br> ·新闻标题列表新闻标题列表<br> ·新闻标题列表新闻标题列表<br> ·新闻标题列表新闻标题列表<br> ·新闻标题列表新闻标题列表 </div>