• html+css test1


    模拟实验楼提供的一个网页。。

    【可由 git clone https://github.com/shiyanlou/finaltest 获取相关图片素材】

    <!DOCTYPE html>
    <html lang="en">
    <head>
    <meta charset="UTF-8">
    <title>TEST1</title>
    </head>
    <style>
    #countainer{ 1300px;}
    #header{height: 130px;background-color: #2f4f4f;font-size: 16px}
    #paragraph{height: 550px;background-color: lightseagreen;text-align:center;font-size: 30px}
    #left{height:350px;310px;float: left;}
    #center1{height:350px;340px;float: left;}
    #center2{height:350px;310px;float: left;}
    #right{height: 350px; 340px;float: left;}
    #footer1 {background-color: powderblue;height: 600px;clear:both;text-align:center;}
    #footer2 {background-color: lightslategrey;height: 100px;clear:both;text-align:center;}
    </style>
    <body>
    <div id="countainer">
    <div id="header">
    <br/>
    <h1 style="color: aliceblue;text-align: center">Ruohua 3kou</h1>
    <a href="#con"style="float: left;color: lightgray">Contact me</a>
    </div>

    <div id="paragraph">
    <br/>
    <p>
    <img src="profile.png">
    <br/>
    <h1 style="color: aliceblue">we are engineers</h1>
    <p style="color: aliceblue">we are young</p>
    </p>
    </div>

    <div id="left" align="center">
    <h1 style="color:lightslategray">Working</h1>
    <img src="cabin.png" height="260" width="300">
    </div>

    <div id="center1" align="center">
    <h1 style="color:lightslategray">Eating</h1>
    <img src="cake.png" height="260" width="300">
    </div>

    <div id="center2" align="center">
    <h1 style="color:lightslategray">Playing</h1>
    <img src="game.png" height="260" width="300">
    </div>

    <div id="right" align="center">
    <h1 style="color:lightslategray">Sleeping</h1>
    <img src="circus.png" height="260" width="300">
    </div>

    <div id="footer1">
    <a name="con">
    <br>
    <h1 style="color: lightslategray;">let's learn with me
    <br>
    good good study, day day up
    </h1>
    </a>
    <div style="background-color: orange; height: 450px; 400px;margin: 0 auto">
    <img src="user.png" style="text-align: center">
    <br /><br />
    <form action="MAILTO:1101811211@qq.com" method="post" enctype="text/plain">
    <h3>Send email to me </h3><br>
    your name:<br>
    <input type="text" name="name" value="yourname" size="20"><br>
    your email:<br>
    <input type="text" name="email" value="youremail" size="20"><br>
    What you wanna say:<br>
    <input type="text" name="comment"size="20"><br><br>
    <input type="submit" value="send">
    <input type="reset" value="rewrite">
    </form>
    </div>
    </div>
    <div id="footer2" align="center">
    </div>
    </div>
    </body>
    </html>

  • 相关阅读:
    冒泡 希尔 快速 插入 堆 基数
    排序总结
    软件工程(齐治昌-谭庆平-宁洪)
    Java简单计算器
    插入排序
    Android中theme.xml与style.xml的区别
    activity theme parent 属性浅析
    xml中不能直接添加ViewGroup
    Java中对象的上转型对象
    Android原理View、ViewGroup
  • 原文地址:https://www.cnblogs.com/ruoh3kou/p/8530897.html
Copyright © 2020-2023  润新知