美文网首页
css2018-10-31作业

css2018-10-31作业

作者: 癫狂麦芽糖 | 来源:发表于2018-10-31 21:06 被阅读0次

    http://127.0.0.1:8848/2day3/index.html

    image.png
    image.png
    <!DOCTYPE html>
    <html>
        <head>
            <meta charset="utf-8" />
            <title>特斯拉</title>
            <style type="text/css">
                ul{
                    list-style-type: none;
                    margin: 0;
                    padding: 0;
                    overflow: hidden;
                }
                li{
                    float: left;
                    padding: 10px;
                    color: white;
                }
                li a{
                    text-decoration: none;
                    display: block;
                    text-align: center;
                    color: white;
                }
                li a:hover{color: gray;}
                #txt2{
                    color: #222222;
                }
            </style>
        </head>
        <body>
            <div id="headnav" style="height: 60px;background-color: #222222;">
                <img src="img/360桌面截图20181031193844.jpg" style="float: left; padding-left: 20px; padding-right: 200px;">
                <ul>
                    <li><a href="https://www.tesla.cn/models"><h5>MODEL S</h5></a></li>
                    <li><a href="https://www.tesla.cn/modelx"><h5>MODEL X</h5></a></li>
                    <li><a href="https://www.tesla.cn/model3"><h5>MODEL 3</h5></a></li>
                    <li><a href="https://www.tesla.cn/roadster"><h5>ROADSTER</h5></a></li>
                    <li><a href="https://www.tesla.cn/energy"><h5>ENERGY</h5></a></li>  
                </ul>
                <ul>
                    <li><a href="img/360桌面截图20181031205403.jpg" style="float: right;">订阅更新</a></li>
                </ul>
                    <div id="popover" class="mui-popover">
                        <div class="mui-scroll-wrapper">
                            <div class="mui-scroll">
                                <ul class="mui-table-view">
                                    <li class="mui-table-view-cell"><a href="#">Item1</a></li>
                                    <li class="mui-table-view-cell"><a href="#">Item2</a></li>
                                    <li class="mui-table-view-cell"><a href="#">Item3</a></li>
                                    <li class="mui-table-view-cell"><a href="#">Item4</a></li>
                                    <li class="mui-table-view-cell"><a href="#">Item5</a></li>
                                </ul>
                            </div>
                        </div>
                    </div>
                    <a href="#popover" id="openPopover" class="mui-btn mui-btn-primary mui-btn-block">打开弹出菜单</a>
                    mui('.mui-scroll-wrapper').scroll()
                </select>
            </div>
            <div id="headpic">
                <img src="img/section-hero-background.jpg" width="100%">
            </div>
            <div id="page1">
                <div>
                    <div style="width: 200px;height: 600px;float: left;"></div>
                    <div style="width: 200px;height: 600px;float: right;"></div>
                    <table id="txt1" align="center">
                        <tr><th><h1>出色的安全和性能表现</h1></th></tr>
                        <tr><td width="700px">Model S 自诞生之日起就是为了成为一款安全、高性能的轿车而设计。得益于特斯拉独特的纯电动动力总成,Model S 的性能表现十分出色,0-100公里/小时加速最快仅需 2.7 秒。通过 Autopilot 自动辅助驾驶(选装),Model S 还可以使高速公路驾驶更为安全且轻松,让你更好的享受驾驶乐趣。</td></tr>
                    </table>
                    <table id="txt2" style="float: left;">
                        <td><img src="img/360桌面截图20181031204225.jpg" height="200px" ></td>
                        <tr><th>自适应大灯</th></tr>
                        <tr><td width="450px">Model S 现已新增全 LED 自适应前照灯系统。新车灯的外形更为优雅,安全性也进一步提升:14个动态 LED 转向灯可显著改善夜间驾驶,尤其是夜间弯道行驶时的可见度。</td></tr>
                    </table>
                    <table id="txt2" style="float: right;">
                        <td><img src="img/360桌面截图20181031204239.jpg" height="200px" ></td>
                        <tr><th>HEPA 空气过滤系统</th></tr>
                        <tr><td width="450px">Model S 现已新增高性能的 HEPA 空气过滤系统(选装),能够过滤掉 99.97% 以上的尾气污染物微粒,并有效滤除车内空气中的一切过敏原、细菌及其他杂质。</td></tr>
                    </table>
                <div></div>
                </div>
                
            </div>
        </body>
    </html>
    #未完待续
    

    未完待续

    相关文章

      网友评论

          本文标题:css2018-10-31作业

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