html 相关问题

盒子的高度是130px，不明白为什么？。盒子 { 行高：120px；背景颜色：#cd0000；颜色：#fff； } 。内容 { 显示：内联块；行高：20px； } 盒子的高度是130px，不明白为什么？ .box { line-height: 120px; background-color: #cd0000; color: #fff; } .content { display: inline-block; line-height: 20px; } <div class="box"> <div class="content">1<br />2<br />3<br />1</div> </div> 设置.box的高度120px，就会是120px，但不知道为什么会出现130px？只需使用 height 而不是 line-height 作为 .box div。 line-height这里真的没有意义： .box { height: 120px; background-color: #cd0000; color: #fff; } .content { display: inline-block; line-height: 20px; } <div class="box"> <div class="content">1<br />2<br />3<br />1</div> </div>

html css

回答 1 投票 0

粘性元素和相对元素兄弟的混淆

我有一个非常基本的html：我有一个非常基本的html： <!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <style> #nav { height: 50px; background-color: #333; position: sticky; top: 0; } #card { position: relative; background: linear-gradient(45deg, #f3ec78, #af4261); min-height: 1200px; } </style> </head> <body> <div id="nav"></div> <div id="card"></div> </body> </html> 首先我知道解决方案是将 z-index 放置到我的导航元素中。当滚动时将粘性导航元素放置在卡片元素下方时，我会产生疑问，但我不太确定发生这种情况的原因。主要是因为“position:relative”本身不会创建stacking context并且我知道position: sticky创建一个堆叠上下文。我还知道我的粘性元素按预期工作，唯一的问题是它位于具有相对位置的卡片元素下方。我问了chatGTP，它提到了一些关于层的内容与堆叠上下文不完全相同，但我仍然对此很困惑。有人对此有合理的解释吗？这种情况发生在 safari、chrome 和 firefox 中何塞， “粘性导航元素放置在我的卡片元素下方”，这是元素放置在页面上的方式。您的卡片位于 html 中的导航之后，因此如果卡片元素存在于页面上的同一 x,y 平面中，则卡片元素将位于导航之上。根据 MDM 和 css 规范： “盒子沿着“z 轴”排列，并且格式化为一个在另一个之上” “粘性创建堆叠上下文”这一事实在这种情况下不起作用，因为导航没有任何子项。再次根据 MDM： “其子堆叠上下文的 z-index 值仅在此父级中有意义” 希望这足以为您解释这种行为。

html sticky stacking-context

回答 1 投票 0

在正则表达式中包含连字符，如何？

我有一些使用正则表达式的 JavaScript 代码，用于验证表单中的名称字段： var alphaExp = /^[a-zA-ZåäöÅäÖ\s]+$/; 我希望正则表达式允许包含连字符的名称，例如 Anna-nicole。我...

javascript html regex security validation

回答 4 投票 0

渲染上的 Flask 图像不显示

我在渲染上有一个 Flask 应用程序，我正在使用渲染永久磁盘（/var/static/uploads）来存储上传的图像，图像已上传，但我在 html te 上渲染它们时遇到问题...

python html flask flask-sqlalchemy render.com

回答 1 投票 0

使用d3访问txt本地文件

我是 D3、Javacript 和 HTML 新手。我的项目的存储库如下：项目： facebook_combined.txt 索引.html 网络.js 我正在尝试从index.html访问facebook_combined.txt...