• DIV+CSS(博客框架)


    <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
    <html xmlns="http://www.w3.org/1999/xhtml">
    <head>
        <title></title>
        <link href="blog.css" rel="stylesheet" type="text/css" />
    </head>
    <body>
        <div id="container">
            <div id="header">
                <div id="menu">
                    <ul>
                        <li><a href="#">首页</a></li>
                        <li class="menugap"></li>
                        <li><a href="#">博客</a></li>
                        <li class="menugap"></li>
                        <li><a href="#">设计</a></li>
                        <li class="menugap"></li>
                        <li><a href="#">相册</a></li>
                        <li class="menugap"></li>
                        <li><a href="#">论坛</a></li>
                        <li class="menugap"></li>
                        <li><a href="#">关于</a></li>
                    </ul>
                </div>
                <div id="banner">
                </div>
            </div>
            <div id="pagebody">
                <div id="sidebar">
                </div>
                <div id="mainbody">
                </div>
            </div>
            <div id="footer">
            </div>
        </div>
    </body>
    </html>

    body
    {
        font:12px Tahoma;
        margin:0px;
        text-align:center;
        background:#FFF;
    }
    
    #container
    {
        100%;
    }
    
    #header
    {
        800px;
        margin:0 auto;
        height:100px;
        background:#FFCC99;
    }
    
    #pagebody
    {
        800px;
        margin:0 auto;
        height:400px;
        background:#CCFF00;
    }
    
    #footer
    {
        800px;
        margin:0 auto;
        height:50px;
        background:#00FFFF;
    }
    
    #menu
    {
        padding:20px 20px 0 0;
    }
    
    #menu ul
    {
        list-style:none;
        margin:0px;
        float:right;
    }
    
    #menu ul li
    {
        float:left;
        margin:0 10px;
        display:block;
        line-height:28px;
    }
    
    .menugap
    {
        1px;
        height:28px;
        background:#999;
    }
    
    #menu ul li a
    {
        text-decoration:none;
        font-weight:bold;
        color:#666;
    }
    
    #menu ul li a:hover
    {
        color:Red;
    }
    
    #banner
    {
       750px;
       margin:40px 20px auto;
       border-bottom: 5px solid #EFEFEF;
       clear:both;
    }
    
    #pagebody
    {
        800px;
        margin:8px auto;
    }
    
    #sidebar
    {
        160px;
        text-align:left;
        float:left;
        clear:left;
        overflow:hidden;
        border:1px solid #E00;
        height:100%;
    }
    
    #mainbody
    {
        636px;
        text-align:left;
        float:right;
        overflow:hidden;
        border:1px solid gray;
        height:100%;
    }


  • 相关阅读:
    总结一下vue里一些小技巧
    vue使用过程常见的一些问题
    Vue.js 的几点总结Watchers/router key/render
    Hibernate-3
    Hibernate-2
    Hibernate-1
    百词斩一面9.17
    vivo一面凉经
    中兴技术面被怼面经
    红黑树
  • 原文地址:https://www.cnblogs.com/wjchang/p/3671552.html
Copyright © 2020-2023  润新知