html 相关问题

HTML（超文本标记语言）是用于构造网页和格式化内容的标准标记语言。 HTML在语义上描述了网站的结构以及用于表示的提示，使其成为标记语言，而不是编程语言。 HTML主要与CSS和JavaScript结合使用，为页面添加样式和行为。 HTML规范的最新修订版是HTML5.2。

我的网站在一个我无法摆脱的元素周围有一个奇怪的灰色边框

我正在为课程制作这个网站。我无法让这个灰色边框消失：这是我的该部分的 HTML：我正在为课堂制作这个网站。我无法让这个灰色边框消失：这是我的该部分的 HTML： <div className="general_text" id="playControls"> <div className="general_text" id="login_username_place">{props.userName}</div> <Button className="general_text" onClick={() => navigate('/play')}>Play</Button> <Button className="general_text" onClick={() => logout()}>Logout</Button> </div> 我在 CSS 中将整个背景设置为粉红色： * { background-color: #a965ab; font-family: "Lucida Console", "Courier New", monospace; } ...但我就是不知道如何摆脱灰色边框。有什么想法吗？我尝试将页面的整个背景设置为粉红色。此外，根据“检查页面”，元素周围的类是 <main class="container-fluid bg-secondary text-center"> （我在代码中找不到它）。我将该类的背景颜色也改为粉红色，但什么也没发生。我想我有办法解决这个问题。我猜你的灰色边框应用在 <div className="general_text" id="playControls"> <div className="general_text" id="login_username_place">{props.userName}</div> <Button className="general_text" onClick={() => navigate('/play')}>Play</Button> <Button className="general_text" onClick={() => logout()}>Logout</Button> </div> 您可以使用 CSS 将其添加到我们的代码中，而不是使用某些框架的类名。像这样： #playControls{ border: 10px solid grey; padding-right: 0; padding-left: 0; } <div className="general_text" id="playControls"> <div className="general_text" id="login_username_place">{props.userName}</div> <Button className="general_text" onClick={() => navigate('/play')}>Play</Button> <Button className="general_text" onClick={() => logout()}>Logout</Button> </div>

html css

回答 1 投票 0

如何在 React js 中更新我的订单挂钩？

我正在尝试更新订单挂钩中的值。然而，这些值似乎没有更新。我对 React 相当陌生，不确定我在这里做错了什么。有任何想法吗？这是我的代码： c...

javascript html reactjs react-hooks

回答 1 投票 0

将图像调整到相同高度并横向滚动

我正在尝试制作一个包含一些图片的基本组合网站，目的是使其全部适合单个视图，并在用户滚动时从侧面滚动图像。我还有一些图像...

javascript html css tailwind-css

回答 1 投票 0

如何用 Flask 和 Javascript 制作“显示更多”按钮？

我有一组项目，我想在无序列表中显示。首先，我只想显示其中的一些，在按下“显示更多”按钮后，其他项目就会显示......

javascript python html flask

回答 1 投票 0

新用户登录时无法从cookie中获取当前用户信息

我在 Angular 应用程序中使用 ngx-cookie-service 模块来临时存储用户相关信息，例如“用户名”或“userId”。对于第一个尝试登录应用程序的用户，...

html angular nginx ngx-cookie-service

回答 1 投票 0

Safari 中 Flex、列和网格的奇怪问题

任何人都可以向我解释一下这是否是一个错误或者我应该向 Safari 团队报告什么在除 Safari 之外的任何浏览器中，我都能得到正确的渲染： https://play.tailwindcss.com/uzqrEtPtKX 任何人都可以向我解释这是否是一个错误或者我应该向 Safari 团队报告什么在除 Safari 之外的任何浏览器中，我都能得到正确的渲染： https://play.tailwindcss.com/uzqrEtPtKX <div class="flex min-h-screen flex-col flex-wrap"> <div class="grid gap-5 grid-cols-2"> <div>Hello</div> <div>Hello</div> <div>World</div> <div>World</div> </div> </div> 但是在 Safari 中，对象沿着页面分布，我不明白为什么。此问题的常见解决方法是使用 height 而不是 min-height。然而，这可能并不适合所有情况，因为它设置了固定的高度。另一个解决方法是在 Flex 容器周围添加一个额外的包装器，并将该包装器设置为全高块。 <div class="h-screen"> <div class="flex flex-col flex-wrap"> <div class="grid gap-5 grid-cols-2"> <div>Hello</div> <div>Hello</div> <div>World</div> <div>World</div> </div> </div> </div> 在此代码中，具有 div 类的外部 h-screen 设置固定高度 100vh，并且具有 div 类的内部 flex 现在可以在 Safari 中按预期运行。

html css safari tailwind-css

回答 1 投票 0

如何控制移动视图表格中的字体大小

我正在尝试控制 1x3 表格内文本的字体大小，仅用于移动视图。是的，我包括：我正在尝试控制 1x3 表格内文本的字体大小，仅用于移动视图。是的，我包括： <meta name = "viewport" content = "width=device-width, initial-scale=1.0"> <table width="700" align="center"> <tr> <td><b><a href= "ListOfGenreLists.html" style="font-size: 40pt; color: #4B0082; text-decoration: none">Genre</a></b>    </td> <td><b><a href= "ListOfMiscellaneousLists.html" style="font-size: 40pt; color: #4B0082; text-decoration: none">Miscellaneous</a></b> </td> <td><b><a href= "ListOfYearLists.html" style="font-size: 40pt; color: #4B0082; text-decoration: none">Year</a></b> </td> </tr> </table> @media screen and (max-width:767px) { table, td { display: block; } td { position: relative; padding-left: 0%; font-size: 10%; line-height: 50px; } } 也许使用检测脚本？ // Detect which mobile devices function isMobile() { return /Android|webOS|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent); } // Load the appropriate CSS file if (isMobile()) { document.write('<link rel="stylesheet" href="mobile.css">'); } else { document.write('<link rel="stylesheet" href="desktop.css">'); }

html css

回答 1 投票 0

将 JS 变量传递到元标记 http-equiv=refresh 到 url 字段

假设我的网址是 http://example.com#example.org 我想在 5 秒后重定向当前选项卡“example.com”以查询参数“example.org” <question vote="0"> <p>假设我的网址是 <a href="http://example.com#example.org" rel="nofollow noreferrer">http://example.com#example.org</a> 我想在 5 秒后重定向当前选项卡“example.com”以查询参数“example.org”</p> <pre><code><head> <title></title> <script type="text/javascript"> var x = window.location.hash.substr(1); </script> <meta http-equiv="refresh" content="4;url=x"/> </head> <body> </body> </code></pre> </question> <answer tick="true" vote="1"> <p>您不应该使用元标记来刷新，而应该使用带有超时的 Javascript 来处理重定向。使用您所拥有的方法，元标记无法获取从 Javascript 传入的值。</p> <pre><code><script type="text/javascript"> setTimeout(function() { window.location.href = window.location.hash.substr(1); }, 5000); </script> </code></pre> </answer> <answer tick="false" vote="0"> <p>替代方法，使用脚本编写元标记：</p> <pre><code><head> <script type="text/javascript"> var x = window.location.hash.substr(1); document.write("<meta http-equiv=\"refresh\" content=\"4;URL='" + x + "'\"/>"); </script> </head> </code></pre> </answer> </body></html>

javascript html query-string

回答 0 投票 0

浮动时段落向下：左

为什么“什么”这个词向左浮动时会下降到下一行？ “为什么”除了“为什么”这个词之外没有？它们都是段落。我是一个 html/css 菜鸟，还在学习，谢谢为什么“什么”这个词向左浮动时会下降到下一行？ “为什么”除了“为什么”这个词之外没有？它们都是段落。我是一个 html/css 菜鸟，还在学习中，谢谢 <!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="style1.css"> </head> <body> <div class="container"> <h1>I love carrots</h1> <p id="what">what</p> <p id="why">why</p> </div> </body> </html> style1.css .container{ border: solid; overflow: hidden; } .container #what{ float: left; }``` [enter image description here](https://i.stack.imgur.com/ZwHtz.png) I was expecting to be beside the word why and not go next line 问题在于 <p> 标签的边距相互干扰。如果您检查开发工具中的元素，您会发现当 p#why 浮动时，p#what 仍然延伸到页面的左边缘，因此它们有点重叠。你可以也向左浮动p#why，或者删除 p#why 的下边距并删除 p#what 的上边距或者你当然可以选择像 Flexbox 这样的单独的布局方法，但这是使用浮动的方法。 .container { border: solid; overflow: hidden; } .container + .container { margin-top: 20px; } /* original */ .container #what { float: left; } /* option 1 */ .container #what2, .container #why2 { float: left; } /* option 2 */ .container #what3 { float: left; margin-top: 0; } .container #why3 { margin-bottom: 0; } <figure> <div class="container"> <h1>I love carrots</h1> <p id="what">what</p> <p id="why">why</p> </div> <figcaption>original</figcaption> </figure> <figure> <div class="container"> <h1>I love carrots</h1> <p id="what2">what</p> <p id="why2">why</p> </div> <figcaption>option 1</figcaption> </figure> <figure> <div class="container"> <h1>I love carrots</h1> <p id="what3">what</p> <p id="why3">why</p> </div> <figcaption>option 2</figcaption> </figure>

html css

回答 1 投票 0

在选择中选择一个选项时，我必须禁用不匹配的选择

我需要根据固定选择的选项禁用不匹配的选择。特别是我选择了“Flatlist”；在此选择的每个选项中，我传递一个“数据选项”属性，该属性对应...

javascript html

回答 1 投票 0

使用 jQuery 单击链接时打开和关闭手风琴

我正在尝试通过链接打开和关闭手风琴。我正在使用 jQuery。您可以在这里看到小提琴 - https://jsfiddle.net/squidraj/x1epjfv7/11/ 如果我点击 p...

html jquery

回答 1 投票 0

转盘连动滚轮独立到侧面

我有一个包含多个轮播行的页面，但是每当我单击“下一个”或“上一个”按钮以显示轮播的其他项目时，它会影响所有轮播，而不仅仅是cli...