首页 > 代码库 > 百度前端技术学院任务-01

百度前端技术学院任务-01

2024-08-31 10:30:36   221人阅读

这两天发现了一个很不错的学习前端的地方：百度前端技术学院。

里面有不同类型的任务，任务之间的难度是递增的，很适合作为练习。

下面是任务-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>

 

百度前端技术学院任务-01


联系
我们