-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathindex.html
38 lines (36 loc) · 2.2 KB
/
index.html
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
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>百度前端技术学院任务总汇</title>
<style>
*{margin: 0; padding: 0; font-family: "Microsoft YaHei";}
h1{font-size: 30px; color: #822929; margin:20px 5% 0px 5%; font-family: "宋体";text-align: center;}
a{text-decoration: none;}
.box{width: auto;border:1px solid #b6ddf9; margin:1% 5%; border-radius: 3px;}
.title{width: auto; background-color: #80caed; color: #008aff; font-size: 18px; padding: 5px 20px;}
.content{/* border:1px solid #d7f0ff; */ margin-top: 10px; border-radius: 5px; margin: 1%;}
.content a{border-radius: 3px; display: inline-block;width: auto; padding: 3px 10px; font-size: 14px; line-height: 20px; margin:5px 10px; background:rgba(71,172,59,0.68); color: #fff;}
.content a:hover{background:rgba(240,195,140,0.82); color: #50276a;}
</style>
</head>
<body>
<h1>努力把所有任务做完</h1>
<div class="box">
<div class="title">第一阶段任务</div>
<div class="content">
<a href="https://tiny-wenwen.github.io/course/task1.html">任务一:零基础HTML编码</a>
<a href="https://tiny-wenwen.github.io/course/task2.html">任务二:零基础HTML及CSS编码(一)</a>
<a href="https://tiny-wenwen.github.io/course/task3.html">任务三:三栏式布局</a>
<a href="https://tiny-wenwen.github.io/course/task4.html">任务四:定位和居中问题</a>
<a href="https://tiny-wenwen.github.io/course/task5.html">任务五:零基础HTML及CSS编码(二)</a>
<a href="https://tiny-wenwen.github.io/course/task6.html">任务六:通过HTML及CSS模拟报纸排版</a>
<a href="https://tiny-wenwen.github.io/course/task7.html">任务七:实现常见的技术产品官网的页面架构及样式布局</a>
<a href="https://tiny-wenwen.github.io/course/task8.html">任务八:响应式网格(栅格化)布局</a>
<a href="https://tiny-wenwen.github.io/course/task9.html">任务九:使用HTML/CSS实现一个复杂页面(待完成)</a>
<a href="https://tiny-wenwen.github.io/course/task10.html">任务十:Flexbox 布局练习</a>
<a href="https://tiny-wenwen.github.io/course/task12.html">任务十二:学习CSS 3的新特性</a>
</div>
</div>
</body>
</html>