html - 在 HTML 中,我怎样才能有边框并填充容器?

标签 html css

以下代码片段显示了正文中的一个 div。两者的高度和宽度均为 100%。 div 有边框。问题是浏览器使 div 的内容框与主体大小相同,将底部和右侧边框发送到 View 之外。我有义务遵守 100% 的规则,整个布局都取决于它们。我怎样才能让我的边框出现?我做错了什么?

西蒙

<html>
    <body style="width:100%;height:100%;">
        <div id="bdiv" style="height:100%;width:100%;border:2px solid green;">Difficult to remain positive in such conditions</div>
    </body>
</html>

最佳答案

1) 去除body的默认外边距

2) 设置box-sizing: border-box; div 以便在div 内呈现边框

body
{
    margin:0;
}
div
{
    -moz-box-sizing: border-box;
    box-sizing: border-box;
}

FIDDLE

关于html - 在 HTML 中,我怎样才能有边框并填充容器?,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/22682903/

相关文章:

html - 如何使用CSS隐藏特定页面上的类

javascript - 使用 JavaScript 解码 URL 参数

javascript - 如何在重定向后显示另一个页面的隐藏div

html - html 页面上的按钮不会打开到单独的页面

css - 是什么造成了这些巨大的差距?

html - CSS:如何防止 div 的背景颜色位于其上方的图像后面?

css - div 边框不围绕内容

html - 如何显示水平分数符号

CSS。根据设备屏幕宽度(不是窗口)调整 div 大小

CSS:具有两种颜色的背景,水平划分,带有图案?