这两天发现了一个很不错的学习前端的地方：百度前端技术学院。
里面有不同类型的任务，任务之间的难度是递增的，很适合作为练习。
下面是任务-01的代码（并没有涉及到CSS）：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>百度前端技术学院任务-01</title>
</head>
<body>
<h1 align="center">百度前端技术课堂任务-01</h1>
<p><em><strong>这是一个除了gakki之外就没有什么看点的网页，<br><br>你要是觉得无聊，<br><br>可以点击下面的链接去看看知乎、微博、豆瓣这些网站。</strong></em></p>
<ul>
<li><a href="https://www.zhihu.com/">时间黑洞之-知乎</a></li>
<li><a href="http://www.weibo.com/">时间黑洞之-微博</a></li>
<li><a href="http://www.douban.com">时间黑洞之-豆瓣</a></li>
</ul>
<p style="color: red;font-family: Microsoft YaHei"><strong>既然你没有走，那就继续看一下去吧！</strong></p>
<h2 align="left">gakki</h2>
<!--<h3 align="left">你当然想这是你的女朋友！</h3>-->
<p style="font-family: Microsoft YaHei;font-size: 50%">@肉哥</p>
<p style="font-family: Microsoft YaHei">我有个同学说gakki是他女朋友，我只能说，祝他幸福。<br><span style="color: red;font-size: 80%"><em>小心不要被她的男朋友们打死。</em></span><br></p>
<img height="25%" width="25%" src="http://h.hiphotos.baidu.com/zhidao/pic/item/c995d143ad4bd113e408d65358afa40f4afb058d.jpg" alt="this is your girl friend?" title="这个是你的女朋友吗？"><br>
<img height="25%" width="25%" src="http://i106.photobucket.com/albums/m245/hikaru06_2006/beauty/aragaki-ken07011308.jpg" alt="this is your girl friend?" title="听说这个也是你的女朋友？"><br>
<img height="25%" width="25%" src="http://f.hiphotos.baidu.com/zhidao/pic/item/80cb39dbb6fd5266f57fb923ac18972bd40736b4.jpg" alt="this is your girl friend?" title="听说这个还是你的女朋友啊！"><br>
<p><em>---下面是一个小的调查问卷---</em></p>
<form action="" method="get">
Do you like gakki?<br><br>
<label><input type="checkbox" name="gakki">yes!</label>
<label><input type="checkbox" name="gakki">yes!</label>
</form>
<br>
<br>
<form action="action_page.php">
Please tell me why you like gakki:<br>
<input type="text" name="why" value="tell me why you like gakki in here"><br>
<br>
<br>
<input type="submit" name="why" value="submit">
</form>
<p>---end---</p>
<p>---Thanks for watching---</p>
</body>
</html>
时间： 2024-11-13 11:22:21