美文网首页CSS
PYTHON实战计划练手项目一:做一个网页

PYTHON实战计划练手项目一:做一个网页

作者: python入坑者 | 来源:发表于2016-08-04 14:22 被阅读0次

    参与计划的第一天,对照着教程,动手做了个网页,

    效果如下

    我的代码如下:

    !DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>The blah</title>
        <link rel="stylesheet" type="text/css" href="homework.css">
    </head>
    <body>
        <div class="header">
            <img src="images/blah.png">
            <ul class="nav">
                <li><a href="#">Home</a></li>
                <li><a href="#">Site</a></li>
                <li><a href="#">Other</a></li>
            </ul>
        </div>
        <div class="main-content">
            <h2>The Beach</h2>
            <hr>
            <ul class="photos">
                <li><img src="images/0001.jpg" width="150" height="150" alt="Pic1"></li>
                <li><img src="images/0003.jpg" width="150" height="150" alt="Pic2"></li>
                <li><img src="images/0004.jpg" width="150" height="150" alt="Pic3"></li>
            </ul>
            <p>
                When I wrote the following pages, or rather the bulk of them, I lived alone, in the woods,
                a mile from any neighbor, in a house which I had built myself, on the shore of Walden Pond,
                in Concord, Massachusetts, and earned my living by the labor of my hands only. I lived there
                two years and two months. At present I am a sojourner in civilized life again.
            </p>
        </div>
        <div class="footer">
            <p>©mugglecoding</p>
        </div>
    </body>
    </html>
    

    总结:
    1.自己动手做比想像中难一点,基础知识记不住,对照着教程才做出来;
    2.引用CSS的时候,没注意多打了个分号,导致图片的排列是竖着排的,找了一段时间才发现原因;
    3.通过实操能更好的理解并记住相关知识

    相关文章

      网友评论

        本文标题:PYTHON实战计划练手项目一:做一个网页

        本文链接:https://www.haomeiwen.com/subject/cpbcsttx.html