最为纯粹简单的后台管理页面框架

<!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 runat="server">
    <title>在线报名系统</title>
    <style type="text/css">
        /*开始   初始CSS模板   开始*/body, div, address, blockquote, iframe, ul, ol, dl, dt, dd, li, dl, h1, h2, h3, h4, h5, h6, p, pre, table, caption, th, td, form, legend, fieldset, input, button, select, textarea
        {
            margin: 0;
            padding: 0;
            font-weight: normal;
            font-style: normal;
            font-size: 100%;
            font-family: inherit;
        }
        html, body
        {
            height: 100%;
            overflow:hidden;
        }
        ol, ul, li
        {
            list-style: none;
        }
        img
        {
            border: 0;
        }
        body
        {
            color: #000;
            background: #FFF;
            text-align: left;
            font: 12px/1.5 Arial, Helvetica, sans-serif;
        }
        .clear
        {
            clear: both;
            height: 1px;
            margin-top: -1px;
            width: 100%;
        }
        /*结束  初始CSS模板  结束*/
        
        #head
        {
            /*margin:2px  auto;*/
            margin: 0px;
            height: 25px;
            width: 100%;
            background: #B0CFFA;
            border-bottom: solid 1px #B0CFFA;
            vertical-align :bottom;
            position:absolute;
            top:0px;
        }
        #head p
        {
            margin-left: 10px;
            color: #FFFFFF;
        }
        #content
        {
            width: 100%;
            height: auto;
            position:absolute;
            overflow:auto;
            top:26px;
            bottom:20px;
        }
        #content .left
        {
            float: left;
            width: 200px;
            height: 100%;
            vertical-align: top;
            border-right:solid 1px #B0CFFA;
        }
        #content .right
        {
            overflow: auto;
            background: silver;
            height: 100%;
           
        }
        #fotter
        {
            background: #0099CC;
            height: 20px;
            width: 100%;
            border-top: solid 1px blue;
            position:absolute;
            bottom:0px;
        }
    </style>
</head>
<body>
    <form id="form1" runat="server">
    <div id="head">
        <p>
            欢迎观临最为纯粹简单的后台管理系统平台</p>
    </div>
    <div id="content">
        <div class="left">
            <a href="Default.aspx" target="mainFram">测试链接</a><br />
            <a href="http://www.cnblogs.com" target="mainFram">博客园</a><br />
            <a href="http://www.CSDN.net" target="mainFram">CSDN</a>
        </div>
        <div class="right">
            <iframe name="mainFram" frameborder="0" scrolling="auto" height="100%" width="100%">
            </iframe>
        </div>
    </div>
    <div id="fotter">
        <p>
            今天是星期四，2014年7月10日</p>
    </div>
    </form>
</body>
</html>
posted on 2014-07-10 22:38 意识与存在阅读(2488) 评论(0) 编辑收藏举报