zoukankan      html  css  js  c++  java
  • 小demo

    <!doctype html>
    <html>
    <head>
    <meta charset="utf-8">
    <title>no1</title>
    <link rel="stylesheet" type="text/css" href="css/reset.css" />
    <link rel="stylesheet" type="text/css" href="css/index.css" />
    </head>
    
    <body>
    <div class="header">
        <div class="headerr clearfix">
            <ul class="clearfix">
                <li class="headerr1"><a href="#" title="">English</a></li>
                <li class="headerr2"><a href="#" title="">中文</a></li>
            </ul>
        </div>
    </div>
    <div class="nav">
        <div class="navv">
        <a href="#"><img class="logo" src="images/logo.jpg" alt="这是一张图片" title="logo" /></a>
            <ul>
                <li class="nav1"><a id="nav1" href="#" title="">首页</a></li>
                <li><a href="#" title="">关于我们</a></li>
                <li><a href="#" title="">咨询动态</a></li>
                <li><a href="#" title="">产品服务</a></li>
                <li><a href="#" title="">案例</a></li>
                <li class="nav2"><a href="#" title="">联系我们</a></li>
            </ul>
        </div>
    </div>
    <div class="banner">
        <a href="#" title=""><img src="images/banner.jpg" alt="这是一张图片" title="banner" /></a>
    </div>
    <div class="content1">
        <div class="content1-1">
            <a id="link" href="#">最新动态:</a>
        </div>
    </div>
    <div class="content2">
        <div class="content2-1">
            <img src="images/banner2.jpg" alt="这是这一张图片" title="" class="img" />
        </div>
        <div class="content2-2">
            <p class="p1">埃能基诺(上海)能源科技有限公司</p>
            <p class="p2">ABOUT</p>
            <p class="p3">埃能基诺(上海)能源科技有限公司是集研发、制造、市场、销售、服务于一体的综合性环境服务公司。在脱硝、脱硫、除尘领域...</p>
            <p class="p4"><a href="#"><img src="images/icon2.jpg"/>了解更多</a></p>
        </div>
    </div>
    <div class="footer">
        <div class="footer1">
            <div class="logo1">
                <a href="#"><img src="images/logob.jpg" alt="这是一张图片" title=""/></a>
            </div>
            <div class="footer1-1">
                <p>埃能基诺(上海)能源科技有限公司</p>
                <p>地址:上海市浦东新区金湘路225弄,禹州国际3期2号楼507室(201206)</p>
                <p>埃能基诺能源科技有限公司 沪ICP备15049282号</p>
                <p>友情链接:http://wwww.scandenox.dk/</p>
            </div>
        </div>
    </div>
    </body>
    </html>
    @charset "utf-8";
    /* CSS Document */
    .header{
        width:100%;
        height:30px;
        background:#4d4d4d;
        overflow:hidden;
        }
    .header .headerr{
        width:1100px;
        height:30px;
        margin:0px auto;
        }
    .header .headerr ul li{
        float:right;
        line-height:30px;
        }
    .header .headerr ul .headerr1 a{
        color:#886e58;
        font-size:12px;
        padding-left:15px;
        background:url(../images/icon3.jpg) no-repeat left center;}
    .header .headerr ul .headerr2 a{
        color:#fff;
        font-size:12px;
        padding:0px 15px;}
    .nav{
        width:100%;
        height:112px;}
    .nav .navv{
        width:1100px;
        height:112px;
        margin:0px auto;
        }
    .nav .navv .logo{
        margin-bottom:16px;}
    .nav .navv ul{
        float:right;
        margin-top:40px;}
    .nav .navv ul li{
        float:left;
        padding:0px 20px;
        background:url(../images/icon3.jpg) left center no-repeat;
        font-weight:bold;
    }
    .nav .navv #nav1{
        color:#0C0;}
    .nav .navv .nav1{
        background:none;}
    .nav .navv .nav2{
        padding-right:0px;}    
    
    .banner{
        width:1350px;
        height:599px;
        margin:0px auto;}
    
    .content1{
        width:100%;
        height:79px;
        border-bottom:#e6e6e6 1px solid;}
    .content1 .content1-1{
        width:1100px;
        height:79px;
        background:url(../images/icon.jpg) no-repeat 0px 33px;
        margin:0px auto;}
    .content1 .content1-1 #link{
        float:left;
        padding:30px 17px;}
    .content2{
        width:1100px;
        height:531px;
        margin:0px auto;}
    .content2 .content2-1{
        float:left;
        width:636px;}
    .content2 .content2-1 img{
        margin-top:53px;}
    .content2 .content2-2{
        float:right;
        width:389px;
        padding-top:150px;
        padding-left:75px;
        }
    .content2 .content2-2 .p1{
        color:#0eab4a;
        font-size:22px;
        font-weight:bold;
        }
    .content2 .content2-2 .p2{
        color:#0eab4a;
        font-size:50px;
        font-weight:bold;
        font-style:italic;
        }
    .content2 .content2-2 .p3{
        font-size:14px;
        line-height:2em;
        }
    .content2 .content2-2 p{
        padding-bottom:10px;}
    
    .footer{
        width:100%;
        height:127px;
        background:#878787;}
    .footer .footer1{
        width:1100px;
        height:127px;
        margin:0px auto;}
    .footer .footer1 .logo1{
        float:left;
        width:78px;
        margin-top:27px;
        padding-left:70px;
        padding-right:30px;
        border-right:1px #b7b7b7 solid;}
    .footer .footer1 .footer1-1{
        float:left;
        width:530px;
        margin-top:27px;
        padding-left:30px;
        padding-right:20px;
        line-height:1.3em;
        color:#fff;
        }
    html , body, div, span, applet, object, iframe,
    h1, h2, h3, h4, h5, h6, p, blockquote, pre,
    a, abbr, acronym, address, big, cite, code,
    del, dfn, em, img, ins, kbd, q, s, samp,
    small, strike, strong, sub, sup, tt, var,
    b, u, i, center,
    dl, dt, dd, ol, ul, li,
    fieldset, form, label, legend,
    table, caption, tbody, tfoot, thead, tr, th, td,
    article, aside, canvas, details, embed, 
    figure, figcaption, footer, header, hgroup, 
    menu, nav, output, ruby, section, summary,
    time, mark, audio, video {
        margin: 0;
        padding: 0;
        border: 0;
        font-size: 100%;
        font: inherit;
        vertical-align: baseline;
    }
    /* HTML5 display-role reset for older browsers */
    article, aside, details, figcaption, figure, 
    footer, header, hgroup, menu, nav, section {
        display: block;
    }
    body {
        line-height: 1;
    }
    ol, ul {
        list-style: none;
    }
    blockquote, q {
        quotes: none;
    }
    blockquote:before, blockquote:after,
    q:before, q:after {
        content: '';
        content: none;
    }
    table {
        border-collapse: collapse;
        border-spacing: 0;
    }
    /* 重置文本格式元素 */
    a { text-decoration: none; }
    a:hover { text-decoration: underline; }
    
    /* 清除浮动 */
    .clearfix:before,.clearfix:after {
        content:"";
        display:table;
    }
    .clearfix:after {
        clear:both;
        overflow:hidden;
    }
    .clearfix {
        zoom:1; /* for ie6 & ie7 */
    }
    .clear {
        clear:both;
        display:block;
        font-size:0;
        height:0;
        line-height:0;
        overflow:hidden;
    }
  • 相关阅读:
    一张图片入门Python
    4.1. 如何在Windows环境下开发Python
    你必须知道的EF知识和经验
    XUnit的使用
    如何使用NUnit
    Entity Framework 不支持DefaultValue
    Have You Ever Wondered About the Difference Between NOT NULL and DEFAULT?
    Validation failed for one or more entities. See 'EntityValidationErrors' property for more details
    Entity Framework 与多线程
    sqlite中的自增主键
  • 原文地址:https://www.cnblogs.com/liubeiblog/p/5335548.html
Copyright © 2011-2022 走看看