Kleiner Fall eines Aufsatz-Website-Layouts

Kleiner Fall eines Aufsatz-Website-Layouts:

Einfacher Text sieht langweilig aus, aber das Hinzufügen von Bildern kann die Sinne und Reize des Lesers anregen Leseinteresse. Dies spiegelt wider, wie wichtig es ist, Bilder und Text aufeinander abzustimmen. In diesem Fall wird ein Artikel mit dem Titel ?Jugend ist die sch?nste Begegnung“ anhand von Text- und Bildstilen ausgegeben.

a) Fügen Sie im Editor einige Textabs?tze hinzu.

b) Legen Sie Stile für jeden Textabschnitt separat fest.

c) Fügen Sie ein Bild ein und passen Sie den Abstand zwischen Bild und Text nach Bedarf an.

Verwenden Sie zum Debuggen den Firefox-Browser.

Der Code lautet wie folgt:

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>PHP中文網(wǎng)</title>
</head>
<body>
<p align="center"><strong>青春是最美好的相遇</strong></p>
<p>　　在威斯敏斯特教堂旁邊，矗立著一塊墓碑，上面刻著一段非常著名的話：“當(dāng)我年輕的時(shí)候，我夢(mèng)想改變這個(gè)世界；當(dāng)我成熟以后，我發(fā)現(xiàn)我不能夠改變這個(gè)世界，我將目光縮短了些，決定只改變我的國(guó)家；當(dāng)我進(jìn)入暮年以后，我發(fā)現(xiàn)我不能夠改變我們的國(guó)家，我的最后愿望僅僅是改變一下我的家庭，但是，這也不可能。當(dāng)我現(xiàn)在躺在床上，行將就木時(shí)，我突然意識(shí)到：如果一開始我僅僅去改變我自己，然后，我可能改變我的家庭；在家人的幫助和鼓勵(lì)下，我可能為國(guó)家做一些事情；然后，誰(shuí)知道呢?我甚至可能改變這個(gè)世界?！?nbsp;</p>
<p align="right"><em>——題記</em></p>
<img src="5.jpg" width="200" align="left" vspace="20" hspace="20"/>
<h3>　　<div style="color: red">1. 我們的相遇</div></h3>
<p>　　漫漫青春路，多少岔路口，青春蹉跎，機(jī)會(huì)錯(cuò)過(guò)。而我，慶幸遇上了PHP中文網(wǎng)。</p>
<h3><div style="color: red">2. 我的感恩</div></h3>
<p>　　敲完最后一行代碼，走出辦公室，站在曾經(jīng)覺(jué)得特別高大上的落地窗前，看著倒影中的自己，雖說(shuō)有點(diǎn)累，但感到特別充實(shí)，許久沒(méi)有過(guò)這種踏實(shí)和平靜的感覺(jué)。我喜歡并珍惜作為女程序員的日子。這一切，都要感謝PHP中文網(wǎng)以及PHP中文網(wǎng)的每一位老師。</p>
<img src="6.jpg" width="200" align="right" vspace="20" hspace="20"/>
<h3>　　<div style="color: red">3. 夢(mèng)想開花</div></h3>
<p>　　我慶幸在最美的年華、最渴望改變的時(shí)候遇到了PHP中文網(wǎng)，慶幸遇上了PHP中文網(wǎng)的老師，因?yàn)槟銈兊膶I(yè)和專注，才成就了我向往的IT夢(mèng)，才讓我在青春的路上開滿了理想的花。在此真心感謝PHP中文網(wǎng)的每一位老師，縱然時(shí)光荏苒，師恩永遠(yuǎn)銘記在心。</p>
</body>
</html>

wird wie folgt angezeigt:

微信圖片_20180314135747.png