适当(行业标准)设置页脚的方式

时间:2014-03-13 06:24:05

标签: html

创建页脚div的正确方法是什么,我通常使用下面的代码设置我的页脚div,我想知道footer div是如何编码行业标准的。我如何设置页脚,以便在内容填满时它可以转到屏幕底部。

这是我的HTML:

<div id="wrapper">
   <div id="header"></div>
   <div id="content"></div>
   <div id="footer"></div>
</div>

这是我的CSS:

 html {
     background:white;
     height:100%;
 }
 #wrapper {
     width:960px;
     margin-right:auto;
     margin-left:auto;
 }
 #header {
     background:#000000;
     min-height:30px;
 }
 #content {
     background:orange;
     min-height:500px;
     padding:20px;
 }
 #footer {
     clear:both;
     background:black;
     min-height:30px;
     position:relative;
 }

1 个答案:

答案 0 :(得分:0)

如果您使用的是任何小于5的HTML版本,那么它确实没有标准,您所做的就像许多其他布局一样好(尽管我总是使用类和永不ID - but that's a different topic

如果你正在使用HTML5,你应该尽可能地做,你应该使用页脚标记。

使用HTML5时,这是一种更标准的页面布局方式:

   <?php
$scale = array(
    "A" => "Do",
    "B" => "Re",
    "C" => 'Mi',
    "D" => 'Fa',
    "E" => 'So',
    "F" => 'La',
    "G" => 'Ti'
);

$query = isset($_POST['notes']);

if ($query != null)
{
    foreach ($scale as $key => $sound)
    {
        if ($query == $key)  
        {
            echo $sound;
        }
    }
}


?>

<form action="MusicalScale.php" method="post">

<label>Enter in a music note</label>&nbsp;&nbsp;<input type="text" name="notes"><br>
<input type="submit" value="Submit">

</form>

有关HTML5布局的更多信息,请点击此处:

http://www.developer.com/lang/understanding-the-proper-way-to-lay-out-a-page-with-html5.html

https://www.smashingmagazine.com/2009/08/designing-a-html-5-layout-from-scratch/