zoukankan      html  css  js  c++  java
  • web基础,用html元素制作web页面

    观察常用网页的HTML元素,在实际的应用场景中,用已学的标签模仿制作。

    用div,form制作登录页面,尽可能做得漂亮。

    练习使用下拉列表选择框,无序列表,有序列表,定义列表。

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <meta charset="UTF-8">
        <title>简书</title>
    </head>
    <body>
    <div style=" 400px">
        <div id="header"style="background-color: orange"><h2 align="center">登陆</h2></div>
        <div id="content"></div>
        <form>
            Usrename:<input type="text" name="firstname" placeholder="请输入用户名"><br>
            Passwore:<input type="password" name="password"><br>
            <input type="radio" name="role" value="stu">student
            <input type="radio" name="role" value="tea">teacher<br>
            <input type="checkbox" value="true"><span>记住我</span><a href="">登陆遇到问题</a><br>
            <input type="button" value="login" onclick="alert('登陆验证')">
        </form>
        <div id="footer" style="background-color: orange"><p align="center"><i>版权@lin</i></p></div>
    </div>
    <div>
        <select>
            <option>收藏</option>
            <option selected="selected">点赞</option>
            <option>评论</option>
        </select>
        <ul>
            <li>python</li>
            <li>html</li>
        </ul>
        <ol>
            <li>python</li>
            <li>html</li>
        </ol>
    </div>
    <h1>致我们单纯的小美好</h1>
    <p>作者:赵乾乾</p>
    <a href="https://baike.baidu.com/item/%E8%87%B4%E6%88%91%E4%BB%AC%E5%8D%95%E7%BA%AF%E7%9A%84%E5%B0%8F%E7%BE%8E%E5%A5%BD/18813769?fr=aladdin"><img src="https://gss0.bdstatic.com/94o3dSag_xI4khGkpoWK1HF6hhy/baike/w%3D268%3Bg%3D0/sign=44c70673dd88d43ff0a996f44525b526/359b033b5bb5c9eaad0aa2e5de39b6003af3b33f.jpg"></a>
    
    </body>
    </html>

  • 相关阅读:
    2019-2020-1学期20192401《网络空间安全专业导论》第一周学习总结
    14201771010119穷吉
    13201771010119穷吉
    12穷吉201771010119
    11201771010119穷吉
    实验10穷吉201771010119
    实验九201771010119穷吉
    201771010119穷吉第八周
    七次201771010119穷吉
    实验六20177101010119穷吉
  • 原文地址:https://www.cnblogs.com/lintingting/p/7680148.html
Copyright © 2011-2022 走看看