index3.html

<!DOCTYPE html>
<html lang="en">

<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>翡翠学问</title>
    <link rel="stylesheet" type="text/css" href="index3.css">

</head>

<body>
    <div class="top">
        <div id="top1">
            <a href="index.html">首页</a>
        </div>
        <div id="top2">
            <a href="index2.html">翡翠初探</a>
        </div>
        <div id="top3">
            <a href="index3.html">翡翠学问</a>
        </div>
        <div id="top4">
            <a href="index4.html">翡翠创作</a>
        </div>
    </div>
    <div class="box">
        <div class="search">
            <input id="input1" type="text" name="q" placeholder="输入关键词">
            <input id="input2" type="submit" value="搜索">
        </div>
        <div class="content">
            <div>
                <span>学习资料</span>
            </div>
            <div>
                <span>故事分享</span>
            </div>
            <div>
                <span>文学创作</span>
            </div>
            <div>
                <span>视频课程</span>
            </div>
            <div>
                <span>讲座回顾</span>
            </div>
            <div>
                <span>好书推荐</span>
            </div>
        </div>
    </div>


</body>