12

我最近开始了一些网络编程/设计，我正面临这个问题。在 HTML5 中，你有这些很酷的标签，比如sectionandheader和footerall 。

  • 我的第一个问题在这里提出：它们的行为（在 CSS 上下文中）是否与 s完全一样div？

转到更具体的问题，我必须创建一个header -> content (section) -> footer结构简单的网站（注意：我对 IE 兼容性不感兴趣）。我希望中心部分尽可能地（垂直）扩展，直到它遇到页脚。“直到它遇到页脚”部分可以通过一些来实现，padding-bottom但是“尽可能地扩展”部分呢？请注意，在调整页面大小时，当页脚与部分相遇时，页脚应该停止。

我的意思是，我知道有些人div的生活会更轻松，但是按照今天的标准，我是否仍然必须将整个页面包装在一个<div id="container">标签中？于是出现了第二个问题……

  • html我不能通过同时使用和body作为 adiv#container的容器来实现我将实现html的目标html + body吗？bodydiv#container

我希望我的问题很清楚，我知道我在写作时倾向于离题。

请注意，为清楚起见，我将在此处添加我的 HTML 结构和我的 CSS 中的一些亮点，但我不知道它们是否与问题相关。

HTML：

<html>
<head...>
<body>
    <header id="page_header">
        stuff in the header...
    </header>

    <section id="page_content">
        stuff in the main section...
    </section>    

    <footer id="page_footer">
        an almost-sticky footer...
    </footer>
</body>

</html>

CSS：

* {
    margin: 0;
}

html {
    background-image: url('../res/img/bg-light.png');
    height: 100%;
    position: relative;
}

body {
    width: 900px;
    height: 100%;
    margin: 0 auto 20px auto;
    padding: 0;
}

section#page_content {
    min-height: 400px; // ? does this stop the footer from being dragged over the content when resizing?
    width: 80%;
    margin: 0 auto;
}

footer#page_footer {
    position: absolute;
    height: 20px;
    width: 100%;
    left: 0;
    bottom: 0;
}

微注为什么我的body不是从页面的确切顶部开始，而从顶部开始几个像素？只是问问。

4

2 回答 2

9

是的，大多数标签，如<section>,<header>和的行为与's<footer>非常相似。<div>它们在很大程度上取决于您来决定如何使用它们。但是，您不应忽视使用<div>s 的重要性，尤其是在样式方面。我见过一些 CSS 框架（我想到了 twitter Bootstrap 和 Blueprint），它们为您提供了<div class="container"> 样式。不过，为了便于阅读，<section>, <footer>, <header>, and 也是<article>非常有益的。

无论如何，在可能且兼容的情况下使用 HTML5，但我相信您现在总能找到一种有用且有益的方式<div>在您的网络代码中使用 s。

这只是我的意见。

我在搜索时发现了这个链接。它可能比我能更好地阐明这个问题。它指出了<div>在较新的 HTML5 标记上使用 s 的几个不同的地方。

您可以使用<html>or<body>标记代替 div 容器。它肯定没有什么问题，它甚至可以让你的代码稍微干净一些。不过，我个人总是使用某种容器。我发现这个问题我相信答案很清楚。

此外，身体应该填满屏幕。如果不是，请检查您的 CSS。

于 2013-03-21T23:31:20.097 回答
0

您提到的元素是块级元素，就样式而言，其行为与 div 相同，但仅此而已，因为其中一些元素是分段元素，因此，就结构而言，其内容的行为有所不同去。

是的，你总是可以使用 body 作为内容的包装器，但是如果这证明有用的话，现在我们有了main元素。虽然 html 元素是可样式化的，但它相当有限，但 body 元素也是一个块元素。

div 仍然非常有用，因为它们可以用作通用内容容器，因此可以用于样式化内容，而不会破坏因使用其他内容而导致的分段。

于 2013-03-21T23:24:50.367 回答