添加頁眉頁腳和內容佈局分裂

當我添加以下代碼：

<style type="text/css"> 
body { 
margin:0; 
padding:0; 
} 
div#header{ 
width:100%; 
height:65px; 
position:fixed; 
z-index:100; 
background-color:#F00; 
} 

div#footer{ 
width:100%; 
height:65px; 
position:fixed; 
bottom:0; 
background-color:#06F; 
} 
div#content{ 
background-color:#111; 
width:100%; 
height:100%; 
position:absolute; 
    } 
</style> 
<body> 
<div id="container"> 
    <div id="header"> 
     <?php include 's/header.php';?> 
    </div> 
    <div id="content"> 
    <?php include 'index.html';?> 
    </div> 
    <div id="footer"> 
     <?php include 's/footer.php';?> 
    </div> 
</div> 
</body>

我有頭和我以分割畫面點擊不頁腳後，才： pic2

來源

2016-05-04 Czasas

什麼是你的問題是什麼呢？請限制在一定的點，並配置了一個正在運行的代碼示例，而不是粘貼你的整個代碼。 – roNn23

我改變內容爲folow中

<div id="content"> 
    <div id="columns-container"> 
    <div class="column column-a"></div> 
    <div class="column column-b"></div> 
    </div> 
</div>

，並添加如下CSS

#columns-container { 
    position:relative; 
    height: 100%; 
    width: 100%; 
} 
.column { 
    position: absolute; 
} 
.column-a { 
    background-color: green; 
    top: 0; 
    bottom: 0; 
    right: 50%; 
    left: 0; 
} 

.column-b { 
    background-color: yellow; 
    top: 0; 
    bottom: 0; 
    right: 0; 
    left: 50%; 
}

在此URL工作示例

https://jsfiddle.net/vfh2ma1x/

來源

2016-05-04 13:03:00 Zauker

在內容，我想補充的tympanus，linc to code這種佈局，但是當我加` 」。佈局是全頁面上，我想從tympanus網站的所有內容僅侷限於內容DIV，像圖片final pic。

<body> 
<div id="container"> 
    <div id="header"> 
     <?php include 's/header.php';?> 
    </div> 
    <div id="content"> 
    <?php include 'index.html';?> // link to split site from tympanus 
    </div> 
    <div id="footer"> 
     <?php include 's/footer.php';?> 
    </div> 
</div> 
</body>

來源

2016-05-04 13:47:55 Czasas

添加頁眉頁腳和內容佈局分裂

回答

相關問題