html - 如何在HTML, body和#app元素中设置最佳大小以适配内容？
设置html,body,#app大小的最佳方式是什么？
我们在使用框架的时候，往往我们的内容会被包含在#app中。
当我们的内容包含在body中的时候，我往往会这样设置html, body的大小。
html{ block-size: 100%;}body { min-block-size: 100%;}当有了#app时，该怎么设置合适呢?这样吗?
html{ block-size: 100%;}body { block-size: 100%;}#app { min-block-size: 100%;}共有3个答案
以下是一个在 HTML、body 和 #app 元素中设置最佳大小以适配内容的示例代码：
<!DOCTYPE html><html lang="en"><head> <style> html, body { height: 100%; margin: 0; padding: 0; } #app { min-height: 100%; width: 100%; box-sizing: border-box; padding: 20px; } </style></head><body> <div id="app"> <!-- 这里添加您的内容 --> </div></body></html>在上述代码中，html 和 body 的高度都被设置为 100% 以填满整个浏览器窗口。#app 元素的最小高度为 100% ，宽度为 100% ，并通过 box-sizing: border-box 和内边距来适应内容。您可以根据实际需求调整内边距和其他样式。
我选择每个新开的项目都统一 reset
https://github.com/jgthms/minireset.css
直接使用 width: 100vw; height:100vh 不行吗？
如果可能考虑到移动端的浏览器地址栏和工具栏遮住一部分的问题，可以考虑使用 width: 100dvw; height: 100dvh
不过我们一般也不会去设置 #app 的宽高吧，宽度就是块级布局的默认 100% 高度则按照内容自动。
除了一些限制显示区域的管理后台或者一些特殊的需求，才会考虑说限制布局的高度在指定区域内滚动。
所以可能把你想要实现的具体目的描述一下？为了实现什么，如果单纯为了限制 #app 的高度那么就用 vh/dvh 这种基于 Viewport 单位就好了
- #单位 - <length> - CSS | MDN
- #6.1.2.2. The Various Viewport-relative Units | CSS Values and Units Module Level 4
- 移动端 body 高度为100vh 时，实际高度超过了视窗高度。 - SegmentFault 思否
-
本文向大家介绍如何使用jQuery设置元素的HTML内容？，包括了如何使用jQuery设置元素的HTML内容？的使用技巧和注意事项，需要的朋友参考一下 要设置元素的HTML内容，请使用方法。您可以尝试运行以下代码以使用jQuery获取元素的HTML内容- 示例 现场演示
-
问题内容： 在设计布局时，我将元素设置为，但是在某些情况下，这失败了，那么应该使用什么？ 要么 嗯，这不是基于意见的，因为每种方法都有其自身的缺陷，那么推荐的方法是什么？为什么？ 问题答案： 如果你想背景图片适用于和，填补了整个浏览器窗口，两者都不是。使用此代替： 我的推理在这里给出（在此我全面解释如何以这种方式应用背景）： 顺便说一句，你为什么要注明原因，并以和分别为，因为无论元素有什么内在的高
-
问题 你需要一个元素中的HTML内容 方法 可以使用Element中的HTML设置方法具体如下： Element div = doc.select("div").first(); // <div></div> div.html("<p>lorem ipsum</p>"); // <div><p>lorem ipsum</p></div> div.prepend("<p>First</p>");//
-
问题内容： 我有一个带有属性的div 。我想更新它的价值；如果我使用，它不会改变吗？我只需要使用吗？ 我在HTML5和jQuery之间感到困惑吗？请指教。谢谢！ 编辑：更新为，但HTML仍未更新。 问题答案： 的HTML JS 从参考： jQuery本身使用该方法以“事件”和“句柄”的名称保存信息，并且还保留任何以下划线（_）开头的数据名称供内部使用。 应当注意，jQuery 不会更改HTML中的
-
问题内容： 有时我看到人们将原始CSS和javascript都应用于全局CSS样式，有时我看到他们将其应用于。 两者之间有什么区别吗？制作全局CSS样式的标准是什么？在它们之间进行选择时，我应该知道什么吗？ 问题答案： 我假设这里的“全局页面样式”是指诸如字体，颜色和背景之类的东西。 就个人而言，我申请的全球页面样式，在大多数情况下，以和简单的元素选择（，，，，等）。这些元素与向用户呈现HTML页
-
问题内容： 我正在构建一个Web应用程序（使用原型），该应用程序需要在DOM中添加大块HTML。其中大多数是包含具有各种属性方式的元素的行。 目前，我在变量中保留HTML的空白行， 现在一切正常，花花公子，但这是最佳做法吗？ 当我更新页面上的代码时，我必须更新blankRow中的代码，因此要插入的新元素相同。当我有40行HTML放入blankRow中时，它变得很烂，然后我也必须对其进行转义。 有更
-
我正在尝试使用画布元素，但高度不能超过像素。如果我尝试使用像素，我会在IE11中得到。这在Chrome中工作正常。画布用于PDF生成，我真的没有时间将生成移动到服务器。 我在谷歌上搜索了一下，看起来大小可能会因平台和浏览器的不同而有所不同。 是浏览器分配的内存和内存设置决定了这一点吗？ 编辑：我在这里找到了一些信息： 看起来我可以有两倍的尺寸。也许这只是为了IE9。
-
在Chrome Developer中运行aXe可访问性工具时，我在和元素上遇到以下错误 ARIA角色必须适合该元素 我的超文本标记语言如下。 如果我删除了角色，我会得到一个错误，说一个页面必须有一个地标角色，但如果我将main添加回html、head或body，我仍然会得到错误 对于头部和身体来说，与地标相关的可接受的ARIA角色是什么？