HTML/study.html at master · zianwangs/HTML · GitHub

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
77
78
79
80
81
82
83
84
85
86
87
88
89
90
91
92
<!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" href="study.css">
</head>
<body>

    <div class="header w">
        <div class="f h"><img src="https://img2.baidu.com/it/u=2488636998,3537005841&fm=26&fmt=auto&gp=0.jpg">
        </div>

        <div class="f h">
            <ul>
                <li><a href="#">首页</a></li>
                <li><a href="#">课程</a></li>
                <li><a href="#">职业规划</a></li>
            </ul>
        </div>

        <div class="search f h">
            <input type="text" placeholder="请输入关键词">
            <button></button>
        </div>

        <div class="user">
            <img src="https://img2.baidu.com/it/u=325567737,3478266281&fm=26&fmt=auto&gp=0.jpg">
            <p>Flosidi1299023</p>
        </div>

    </div>

    <div class="mid">
        <div class="banner">
            <div class="list">
                <ul>
                    <li><a href="#">前端开发<span>></span></a></li>
                    <li><a href="#">后端开发   <span>></span> </a>    </li>
                    <li><a href="#">Web全栈    <span>></span></a>    </li>
                    <li><a href="#">数据库开发 <span>></span> </a>  </li>
                    <li><a href="#">操作系统开发<span>></span></a></li>
                    <li><a href="#">网络工程师<span>></span></a>  </li>
                    <li><a href="#">运维工程师<span>></span></a>  </li>
                    <li><a href="#">应用工程师<span>></span></a>  </li>
                    <li><a href="#">Android/iOS开发<span>></span></a></li>
                </ul>
            </div>

            <div class="course">
                <h3>我的课程表</h3>
                <div class="bd">
                    <ul>
                        <li>
                            <h4>继续学习 Java设计基础</h4>
                            <p>正在学习-面对对象编程</p>

                        </li>
                        <li>
                            <h4>继续学习 数据库原理</h4>
                            <p>正在学习-B+树索引</p>

                        </li>
                        <li>
                            <h4>继续学习 操作系统原理</h4>
                            <p>正在学习-文件系统</p>

                        </li>
                    </ul>
                    <a href="#">我的课程</a>
                </div>
            </div>
        </div>
    </div>

    <div class="recommend">
        <h3>精品课程</h3>
        <ul>

            <li><a href="#">Java</a></li>
            <li><a href="#">MySQL</a></li>
            <li><a href="#">C/C++</a></li>
            <li><a href="#">TypeScript</a></li>
            <li><a href="#">React</a></li>
            <li><a href="#">Python</a></li>
            <li class="rightmost_li"><a  href="#">POSIX</a></li>
        </ul>
    </div>
</body>
</html>