简单网页实现
在学习Python爬虫时，接触了一点HTML的知识，于是就跟着教程动手写了一个网页。
HTML代码是跟着视频写的，CSS样式直接用的教程里的，暂时还没学CSS。
有几点要注意：
1.css样式要和html文件放在一个文件夹下，否则要指定到css所在文件，记得把\改成/。
2.图片也要和html文件放在一个文件夹下，除背景图，其他要指定大小，即width和height。
3.主体部分主要是图片+标题+一句话。一句话用的是电影《降临》里的台词，图片用的也是电影里的外星人文字。
4.最后加了一个商标。
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Arrival</title>
<link rel="stylesheet" type="text/css" href="main.css">
</head>
<body>
<div class="header">
<img src="IMG_6552.JPG" width="1200" height="500">
<ul class="nav">
<li><a href="#">Submit</a></li>
<li><a href="#">Home</a></li>
<li><a href="#">Rebel</a></li>
</ul>
</div>
<div class="main-content">
<h2>Arrival</h2>
<ul class="article">
<li>
<img src="Louise1.jpg" width="90" height="90">
<h3><a href="#">Louise</a></h3>
<p>This was the beginning of your story.</p>
</li>
<li>
<img src="Human1.jpg" width="90" height="90">
<h3><a href="#">Human</a></h3>
<p>Memory is a strange thing.</p>
</li>
<li>
<img src="OfferWeapon_1.jpg" width="90" height="90">
<h3><a href="#">Peace</a></h3>
<p>I used to think.</p>
</li>
</ul>
</div>
<div class="footer">
<p>© Wonz</p>
</div>
</body>
</html>效果：
版权声明：本文为博主原创文章，未经博主允许不得转载。
谷歌公司福利 178人发布
查看3道真题和解析