html 相关问题

我有不同宽度和高度的图像。我想在每个图像下添加一些文本，并确保外部容器具有相同的宽度和高度。我试过：我有不同宽度和高度的图像。我想在每个图像下添加一些文本，并确保外部容器具有相同的宽度和高度。我试过： <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-10"> { IMAGES.map((props) => ( <div class="col-span-1 flex flex-col w-full"> <Image class="rounded-lg object-contain object-center" quality={75} width={400} {...props} /> <h4 class="text-[#00473e] font-semibold text-lg leading-normal mt-2 max-w-60"> {props.alt} </h4> </div> )) } </div> ```The issue with this is that the image heights do not match the largest widths which leaves empty space on the far right of each div <div class="grid grid-cols-1 md:grid-cols-3 gap-4 mb-10"> { IMAGES.map((props) => ( <div class="col-span-1 flex flex-col w-full h-full"> <Image class="rounded-lg object-contain object-center" quality={75} width={400} {...props} /> <h4 class="text-[#00473e] font-semibold text-lg leading-normal mt-2 max-w-60"> {props.alt} </h4> </div> )) } </div> 在网格项中添加一个类（h-full）

html css tailwind-css

回答 1 投票 0

让弹性容器与孩子一起收缩

我有一个 Flexbox 容器，其中有两个项目，其中一个在单击容器时会折叠。第二个项目完美折叠，第一个项目占据了剩余空间。豪...

html css flexbox

回答 1 投票 0

如何使用Python Django 在一行中有多个提交按钮，即使它们是不同的表单提交？

我正在 Python Django 中制作一种清单/待办事项应用程序，并有一个更新表单，我可以在其中保存更新、将其标记为完整或不完整或删除该项目。当前代码显示保存b...

python html css django

回答 2 投票 0

段落中每行无限滚动文本

我有一个大约20行的段落。我希望每一行在 1 次滚动完成后重复自身。例如：假设我在一个段落中有一行内容如下： 1,2,3,4, 我...

html css css-animations

回答 1 投票 0

document.getElementById() 返回 null。请帮助我[重复]

这是我的index.js let todolist = [{id:1 , 标签: "일어나기", 完成: false}]; const renderTodo = async (todo) => { const todoWrapper = document.createElement('div'); todoWrap...

javascript html

回答 1 投票 0

如何让内联元素在空时占用空间？

我有一个 h1 和 h3 标签，它们会使用 Theater.js 擦除自身并键入。问题是，当它擦除自身为空时，它所在的 div 的高度会变小，然后当它有

javascript html css

回答 4 投票 0

Iconify 图标未渲染

<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8" /> <meta name="viewport" content="width=device-width, initial-scale=1.0" /> <title>Document</title> <link rel="stylesheet" href="styles.css" /> <script src="https://code.iconify.design/iconify-icon/2.1.0/iconify-icon.min.js"></script> </head> <body> <div> <span class="icon-[ph--airplay-fill]" style="width: 256px; height: 256px; color: #fff"> </span> </div> </body> </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> <link rel="stylesheet" href="./styles.css" /> <script src="https://code.iconify.design/2/2.1.0/iconify.min.js"></script> </head> <body> <div> <span class="icon-[ph--airplay-fill]" style="display: block;width: 100px;height: 100px;"> </span> <br/> <span class="iconify" data-icon="carbon:airplay-filled" data-inline="false" style="font-size: 48px;color: #ff5733;"></span> </div> </body> </html>

html icons

回答 1 投票 0

引导多个标签并在同一行输入

我试图将两个标签和两个输入放在同一行上。这可能吗？我希望它看起来像这样都在同一行： [标签][输入][按钮]空白[标签2][输入2] ...

html twitter-bootstrap

回答 3 投票 0

HTML 更改占位符方向

如何在样式输入标记占位符中扩展该父样式，并且我希望在左侧样式输入中具有正确的方向。例如这是我的输入：

html css

回答 0 投票 0

HTML注入方法之间的区别？

html元素注入方式有区别吗？在效率、易用性、安全性方面……？通常，当我注入 html 时，我会执行以下操作： const myDivInnerHtml = ' html元素注入方式有区别吗？在效率、易用性、安全性方面......？通常，当我注入 html 时，我会这样做： const myDivInnerHtml = '<div><div>All the elements and etc...</div></div>'; const myDiv = document.createElement('div'); myDiv.id = "myDiv"; myDiv.innerHTML = myDivInnerHtml; $('.document_element').append(myDiv); 虽然我有时做得更直接，就像这样： const myDivInnerHtml = '<div id="myDiv"><div><div>All the elements and etc...</div></div></div>'; $('.document_element').append(myDivInnerHtml); 这是一个简单的过程，可以为我提供所需的结果，但如果 myDivInnerHtml 有很多元素（例如为脚本制作 UI，需要不同的选项卡、按钮），则导航代码可能会变得困难/烦人等）。当您使用innerHTML时，浏览器必须重新解析元素内所有现有的HTML并重建DOM树。在某些情况下，它可能会出现问题，例如重新解析可能会导致对先前构造的 DOM 元素的引用变得无效，因为浏览器本质上是从头开始为该元素重建 DOM 树。如果父 DOM 元素有很多子元素，它也会导致性能问题。使用appendChild添加新元素可以避免重新解析现有内容。相反，新节点直接附加到 DOM 树，这样更高效，并且不会破坏先前解析的元素的功能。

javascript html jquery tampermonkey

回答 1 投票 0

为什么嵌套的内跨度比外跨度高

顺风游乐场为了简单起见，让我使用 tailwind css。有两个 HTML span 元素：#outer 和 #inner。 abc 顺风游乐场为了简单起见，让我使用 tailwind css。有两个 HTML span 元素，#outer 和 #inner。 <p class="font-mono"> abc<span id="outer" class="relative"><span id="inner" class="absolute left-0 top-0">a</span>a</span>defg </p> 我期望#inner 与#outer 重叠，但实际结果显示#inner 的绘制字符略低于#outer：然后我检查开发控制台，发现外部的高度是 19px，但内部的高度是 24px。为什么会发生这种情况？让它们相互重叠的正确方法是什么？尝试删除left-0 top-0 <p class="font-mono"> abc<span id="outer" class="relative"><span id="inner" class="absolute">a</span>a</span>defg </p> 结果：

html css tailwind-css

回答 1 投票 0

iOS Safari 和 Chrome 上的 CSS 无限字幕问题

我创建了一个无限选取框，但在使用 Chrome 或 Safari 时在 iOS 设备上遇到了问题。动画完成后，下一帧会在起始位置短暂显示文本...

html css

回答 1 投票 0

我怎样才能专门从CSS网格/子网格中“排除”一个元素，或者将其正确定位在嵌套网格的复杂纠缠中......

* { 轮廓：1px 实心 rgba(255, 0, 0, .2)； } 奥尔{ *：不是（李）{ 网格区域：无； /* 嗯...这是不对的*/ } 填充：0；列表样式：无；显示：网格；网格模板co...

html css css-grid nested-lists

回答 1 投票 0

仅使用 HTML/CSS 如何仅在父级溢出时显示元素？ [已关闭]

使用 HTML 和 CSS，我想仅在内容溢出时显示元素。我有一个固定的最大高度，我可以对其进行硬编码。子内容可以包含任何内容（文本、图像等），w...