Petit cas de mise en page d'un site Web de dissertation
Petite étude de cas sur la mise en page d'un site Web de dissertation :
Un texte pur semblera ennuyeux, mais l'ajout d'images peut stimuler les sens des lecteurs et susciter leur intérêt pour la lecture. Cela reflète l’importance de faire correspondre les images et le texte. Cette affaire donne naissance à un article intitulé « La jeunesse est la plus belle rencontre » à travers des styles de texte et d'image.
a) Ajoutez quelques paragraphes de texte dans l'éditeur.
b) Définissez les styles pour chaque morceau de texte séparément.
c) Insérez des images et ajustez l'espacement entre les images et le texte selon vos besoins.
Utilisez le navigateur Firefox pour le débogage.
Le code est le suivant :
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>PHP中文网</title> </head> <body> <p align="center"><strong>青春是最美好的相遇</strong></p> <p> 在威斯敏斯特教堂旁边，矗立着一块墓碑，上面刻着一段非常著名的话：“当我年轻的时候，我梦想改变这个世界；当我成熟以后，我发现我不能够改变这个世界，我将目光缩短了些，决定只改变我的国家；当我进入暮年以后，我发现我不能够改变我们的国家，我的最后愿望仅仅是改变一下我的家庭，但是，这也不可能。当我现在躺在床上，行将就木时，我突然意识到：如果一开始我仅仅去改变我自己，然后，我可能改变我的家庭；在家人的帮助和鼓励下，我可能为国家做一些事情；然后，谁知道呢?我甚至可能改变这个世界。” </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> 漫漫青春路，多少岔路口，青春蹉跎，机会错过。而我，庆幸遇上了PHP中文网。</p> <h3><div style="color: red">2. 我的感恩</div></h3> <p> 敲完最后一行代码，走出办公室，站在曾经觉得特别高大上的落地窗前，看着倒影中的自己，虽说有点累，但感到特别充实，许久没有过这种踏实和平静的感觉。我喜欢并珍惜作为女程序员的日子。这一切，都要感谢PHP中文网以及PHP中文网的每一位老师。</p> <img src="6.jpg" width="200" align="right" vspace="20" hspace="20"/> <h3> <div style="color: red">3. 梦想开花</div></h3> <p> 我庆幸在最美的年华、最渴望改变的时候遇到了PHP中文网，庆幸遇上了PHP中文网的老师，因为你们的专业和专注，才成就了我向往的IT梦，才让我在青春的路上开满了理想的花。在此真心感谢PHP中文网的每一位老师，纵然时光荏苒，师恩永远铭记在心。</p> </body> </html>
s'affiche comme suit :
