美文网首页
Day003 - 作业(2018-11-01)

Day003 - 作业(2018-11-01)

作者: 雨雨雨90 | 来源:发表于2018-11-01 10:15 被阅读0次
<!DOCTYPE html>
<html>
    <head>
        <meta charset="utf-8" />
        <title>卧龙控股</title>
        <style type="text/css">
            #div1{
                width: 300px;
                height: 30px;
                /* background-color: red; */
                float: right;
                position: absolute;
                right: 0px;
                top: 30px;
            }
            #div2{
                /* background-color: red; */
                float: left;
                border-left: solid white 1px;
                border-right: solid white 1px;
                width: 11%;
                height: 60px;
                text-align: center; 
                color: white;
            }
            #div3{
                width: 25%;
                height: 80%;
                float: left;
            }
            
        </style>
    </head>
    <body>
        <!-- 标题栏 -->
        <div id="" style="position: relative; overflow: hidden;">
            <div id="" style=" float: left; ">
                <img src="img/图片1-左上标题.jpg" style="padding-left: 20px;"/>
            </div>
                
            <div id="div1">
                <form action="" method="get">
                    <input type="text" name="search" id="input1" value="" placeholder="SEARCH……" 
                    style="background-color: lightgray; "/>
                    <input type="submit" value="查找"/>
                </form>
    
            </div>
        </div>
        
        <!-- 菜单栏 -->
        <div id="" style="overflow: hidden; background-color: #000000; ">
            <div id="div2" style="margin-left: 5%;"><p style="vertical-align: middle;">集团介绍</p></div>
            <div id="div2"><p style="vertical-align: middle;">产品中心</p></div>
            <div id="div2"><p style="vertical-align: middle;">卧龙市场</p></div>
            <div id="div2"><p style="vertical-align: middle;">技术开发</p></div>
            <div id="div2"><p style="vertical-align: middle;">国际合作</p></div>
            <div id="div2"><p style="vertical-align: middle;">投资者关系</p></div>
            <div id="div2"><p style="vertical-align: middle;">新闻资讯</p></div>
            <div id="div2" style="margin-right: 5%;"><p style="vertical-align: middle;">人力资源</p></div>
            
        </div>
        
        <!-- 头条图片 -->
        <div id="" style="height: 600px; background-color: #7FFF00; position: relative;">
            <!-- 图片 -->
            <div id="" style="float: left; width: 100%; height: 100%; background-color: #7FFFD4;">
                
            </div>
            <!-- 红色长条 -->
            <div id="" style="width: 44%; height: 10px; float: left; 
            background-color: red; position: absolute; left: 5%;">
                
            </div>
            <!-- 红色文本框 -->
            <div id="" style="width: 25%; height: 200px; padding: 30px; background-color: red;
            float: left; position: absolute; left: 5%; bottom: 100px; border-top-right-radius: 50px;">
                <h2 align="center"; style="font-size: 40px; color: white;">应用于高铁领域</h2>
                <hr color="white">
                <p style="font-size: 20px; color: white;">中国电机行业……</p>
                <a href="https://www.baidu.com" target="_blank" style="color: white; font-size: 15px;">>查找更多</a>
            <!--    <p style="">查看更多</p> -->
            </div>
            <div id="" style="width: 100px; height: 40px; background-color: gray;
            float: right; position: absolute; bottom: 0px; right: 20px;">
                
            </div>
            
        </div>
        
        <!-- 新闻资讯、卧龙介绍、人才招聘 -->
        <div id="" style="height: 300px; width: 100%; background-color: red;
        float: left; ">
            <div style="width: 50%; height: 100%; background-color: #7FFF00; float: left;">
                <h2 style="padding: 10px;">新闻资讯</h2>
                <ul style="padding: 40px;">
                    <li>XX</li>
                    <li>XX</li>
                    <li>XX</li>
                    <li>XX</li>
                    <li>XX</li>
                    <li>XX</li>
                </ul>
            </div>
            <div style="width: 25%; height: 100%; background-color: #A9A9A9; float: left;">
                <h2 style="padding: 10px;">卧龙介绍</h2>
                <p style="padding: 10px;">XX</p>
                <p style="padding: 10px;">XX</p>
            </div>
            <div style="width: 25%; height: 100%; background-color: #7FFF00; float: left;">
                <h2 style="padding: 10px;">人才招聘</h2>
                <p style="padding: 10px;">XX</p>
                <button type="button" style="margin-left: 10px; background-color: gray; color: white;">MORE -></button>
            </div>
            
        </div>
        
        <!-- 卧龙市场 -->
        <div id="" style="height: 300px; width: 100%; background-color: yellowgreen;
        float: left">
            <div id="" style="width: 100%; height: 20%; background-color: white;">
                <h2 style="padding: 0px; margin-top: 0px;">卧龙市场</h2>
            </div>
            <div id="div3" style="background-color: #000000;"></div>
            <div id="div3" style="background-color: #008000;"></div>
            <div id="div3" style="background-color: #008B8B;"></div>
            <div id="div3" style="background-color: #00AA88;"></div>
            
        </div>
        
        <!-- 产品中心、技术研发、营销网络 -->
        <div id="" style="height: 300px; width: 100%; background-color: gray;
        float: left;">
            <div style="width: 50%; height: 100%; background-color: #7FFF00; float: left;"></div>
            <div style="width: 22%; height: 100%; background-color: #A9A9A9; float: left;"></div>
            <div style="width: 28%; height: 100%; background-color: #7FFF00; float: left;"></div>
        </div>
        
        <!-- 页尾 -->
        <div id="" style="height: 100px; width: 100%; float: left; position: sticky;">
            
        </div>
        
    </body>
</html>

相关文章

  • Day003 - 作业(2018-11-01)

  • day003 作业

    2-3 个性化消息: 将用户的姓名存到一个变量中,并向该用户显示一条消息。显示的消息应非常简单,如“Hello E...

  • 06月03日|Day003|每日心语

    06月03日|Day003|每日心语 【06月03日Day003事项记录】 01、05点22分准时起床; 02、参...

  • 2018-11-01

    2018-11-01 冰雨霞思 2018-11-01 13:40 · 字数 1768 · 阅读 0 · 日记本 区...

  • 2018-03-22 Ch8 Hyperlink

    Day003, 50min,今日共计90min 【语法】 文本或图片 【举例】图片超链接

  • 2018-11-01作业

    using System; using System.Collections.Generic; using Sys...

  • 2018-11-01作业

    namespace ConsoleApplication1{class Program{static void M...

  • auto.chthon.ous|chthon=land, ear

    title: autochthondate: 2018-11-01 15:52:00NO_sents: 78NO_...

  • day003

    单身的时候总是想,怎么没人发现自己的好,恋爱的时候总是想,她是不是不爱我了,总在自我否定中踟蹰着,从开始到现在。

  • Day003

    跑步机 速度 5 10分钟 划船机 2:40 3组 每组2分半 卷腹 3组 每组7个,空中骑车第一组40,第二三组...

网友评论

      本文标题:Day003 - 作业(2018-11-01)

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