HTML文件:
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>抗疫战役</title> <link rel="stylesheet", href="style.css"> </head> <body> <article class="maincon"> <header> <h1>疫情肆虐时,祖国是每位海外同胞坚强后盾 </h1> <time>2020-04-04</time> </header> <p> 4月3日,一架飞机稳稳降落在中国济南遥墙国际机场,180余名防护严密的在英中国留学生平安归国。这是中国驻英国大使馆组织包机,接回在英未成年留学生的首次航班。国内千万颗牵挂着海外学子的心,也随着航班的落地慢慢安定。 </p> <p> “别慌!祖国与你同在。”面对约140万名分布在不同国家和地区的中国海外留学人员,外交部指示280多个驻外使领馆全面动员起来,同当地中国留学人员建立并保持密切联系,及时了解他们的诉求和困难,帮助他们解决所面临的各种实际问题。这样的举措无疑是将留学生们放在“心尖上”,也再一次印证了电影《战狼2》中的那句“中华人民共和国公民:当你在海外遭遇危险,不要放弃!请记住,在你身后,有一个强大的祖国!”。 </p> <img src="1000.png"></img> <p> 山川异域,骨肉相连。一份份“健康包”,一场场防疫讲座,一架架归国包机,是祖国对海外同胞的真情牵挂,也是祖国对海外同胞的爱心守护。在这场全球大流行的疫情中,不论你身在何处,别慌,祖国与你同在! </p> <footer>这是一个尾部区域</footer> </article> </body> </html>
style.css内容
body{ background-color: white; margin: 0; } .maincon{ background-color: wheat; width: 70%; min-width: 500px; border: 3px rgba(0, 0, 0, 0.8) solid; margin: 30px auto; padding: 30px; border-radius: 10px; font-size: 20px; line-height: 2; } .maincon > header{ padding-bottom: 10px; border-bottom: 2px rgba(0, 0, 0, 0.8) dotted; } .maincon time{ color: rgba(0, 0, 0, 0.8); } .maincon h1{ font-size: 2em; } .maincon img{ text-align: center; width: 40%; } .maincon footer{ text-align: center; font-size: 15px; border-top: 2px rgba(0, 0, 0, 0.8) dotted; padding-top: 20px; }