爬虫、网页结构简介

爬虫，爬取特定的网站，获取数据、信息等。

网页一般由三部分组成:HTML标签、CSS样式、JavaScript语句。

HTML:<> 标签语言,整个网页的结构部分
CSS:<a class=''> 网页的样式实现
JavaScript:<script>网页功能实现

常见的HTML标签：

<div></div>  # 网页中的一块区域
<p></p>      # 文字
<li></li>    # 列表 
<img>        # 插入图片
<h1></h1>    # 标题
<a href=''>  # 网页插入链接

实现一个网页

实现的这个网页分为三个部分：header（头）、content（信息）、footer（页脚）。

<!DOCTYPE html>
<html>
    <head>
        <meta charset="UTF-8">
        <title>The blah</title>
        <!--加载css样式-->
        <link rel="stylesheet" type="text/css" href="homework.css">
    </head>
    <body>
    <!--网页结构中有三个部分，所以有三个<div></div>标签-->
    <!--第一部分为标题部分，加载css样式为header-->
        <div class="header">
        <!--加载图片信息-->
            <img src="images/blah.png">
            <!--nav标签定义导航链接的部分-->
            <ul class="nav">
                <li><a href="#">Home</a></li>
                <li><a href="#">Site</a></li>
                <li><a href="#">Other</a></li>
            </ul>
        </div>
        <div class="main-content">
            <h2>The Beach</h2>
            <hr/>
            <ul class="photos">
                <li><img src="images/0001.jpg" width="150" height="150" alt="Picl"></li>
                <li><img src="images/0002.jpg" width="150" height="150" alt="Picl"></li>
                <li><img src="images/0003.jpg" width="150" height="150" alt="Picl"></li>
            </ul>
            <p>
                this is a demo page,just for learning WebPage.
            </p>
        </div>
        <div class="footer">
            <p>©Mugglecoding</p>
        </div>
    </body>
</html>

上述代码就可以实现一个简单的静态网页，在爬虫的学习中，只需要简单的了解网页的结构即可，不需要太过深入。