web-frontend 相关问题

更通用的前端标记的细化。在Web应用程序中,这通常意味着HTML,CSS和JavaScript

有人知道如何使用动态路径参数创建路线吗?

我们已将 user-profile?userid= 迁移到 user-profile/。通过此迁移,如果用户导航主页或其他页面但无法打开此页面...

回答 1 投票 0

错误:NG8001:“路由器出口”不是已知元素:在 Angular 中

我收到以下错误: NG8001:路由器出口不是已知元素: 如果 router-outlet 是 Angular 组件,则验证它是否是该模块的一部分。 如果 router-outlet 是一个 Web 组件...

回答 1 投票 0

手动放置div开始和结束标签

我使用 Madcap Flare 来编写 Web 帮助。它带有有用的代理,可以在构建时自动生成导航。我需要操纵这些代理之一。这很重要,因为我必须与...一起工作

回答 2 投票 0

使用javascript手动放置div开始和结束标签

我使用 Madcap Flare 来编写 Web 帮助。它带有有用的代理,可以在构建时自动生成导航。我需要操纵这些代理之一。这很重要,因为我必须与...一起工作

回答 2 投票 0

Rails 管理面板:用户列表显示错误

我目前正在尝试通过使用管理员和用户创建一个网站来习惯 Rails。但是,当在管理仪表板中显示用户列表时,由于某些原因,会出现以下行: [# 我目前正在尝试通过使用管理员和用户创建一个网站来习惯 Rails。但是,当在管理仪表板中显示用户列表时,由于某些原因,会出现这些行: [#[电子邮件受保护]",password_digest:[已过滤], 创建时间:“2022-08-09 03:47:52.264555000 +0000”,更新时间: “2022-08-09 03:47:52.264555000 +0000”,名字:nil,姓氏:nil, last_change: nil>, #[电子邮件受保护]", 密码摘要:[已过滤],创建时间:“2022-08-19 08:32:37.086901000 +0000",更新时间:"2022-08-19 08:32:37.086901000 +0000",名字:nil,姓氏:nil,last_change:nil>,#[电子邮件受保护]",password_digest:[已过滤],created_at: “2022-08-19 08:32:58.497826000 +0000”,更新时间:“2022-08-19 08:32:58.497826000 +0000",名字:nil,姓氏:nil,last_change: 无>] 这是我用来显示用户列表的代码: <%= @users.each do |hello| %> <%= form_with model: @user, url: '/admin/users/delete' do |f| %> <%= hello.email %> <%= hidden_field_tag( :id, hello.id) %> <%=f.submit "Delete"%> <%end%> <hr> <%end%> 这是我得到的显示屏图片: 图片 如果您能提供帮助,我将不胜感激。谢谢! <%= %>语法(注意=)执行ruby代码并将结果打印到您的html中。 这意味着,除了循环之外,<%= @users.each do |hello| %>还将把@users的结果打印到您的html文件中,这就是您看到的奇怪文本。 要解决这个问题,只需更改 <%= @users.each do |hello| %> 到 <% @users.each do |hello| %> (因此没有 = 符号)。这仍然会执行 ruby 代码,但不会将其返回值传递给您的 html。 更换即可 <%= @users.each do |hello| %> 由 <% @users.each do |hello| %> 这里的问题是 <%= @users.each do |hello| %> 正在打印每个方法的返回值,这是原始的 @users 数组本身。这就是为什么您看到数组打印为 [#<User id: ...>]。要解决此问题,请将 <%= @users.each do |hello| %> 更改为 <% @users.each do |hello| %>。 使用<%= ... %>会将其中代码的结果输出到视图。由于 .each 返回数组本身,因此将 <%= ... %> 与 @users.each 一起使用会导致打印整个用户数组。通过使用 <% ... %>,我们可以防止 Rails 尝试渲染每个的输出,而只是按预期迭代用户。

回答 3 投票 0

用于两个按钮范围滑块的 CSS [关闭]

我想创建一个两个按钮滑块并对其应用样式。我已经创建了滑块,但无法设置滑块的样式。 这是我所需要的 这是我所做的 我无法设计...

回答 1 投票 0

如何让Svelte子组件占据页面的整个高度?

我正在尝试使用 Svelte 构建一个简单的前端,其中我有一个包含不同可能子组件的主页。我的问题是我无法让子组件占据整个高度......

回答 1 投票 0

将节标题与第一个内容项对齐,而不是在 Flexbox 布局中居中

我正在开发一个部分布局,其中有一个标题和一个内容容器,使用 Flexbox 将内容水平居中。内容容器容纳多个媒体卡。 ... 我正在开发一个部分布局,其中有一个标题和一个内容容器,使用 Flexbox 将内容水平居中。内容容器可容纳多个媒体卡。 <section> <h2 class="section-headline">Section Headline</h2> <div class="section-content" style="display: flex; justify-content: center; gap: 20px;"> <div style="border: 1px solid black;"> <h3>Media Card 1</h3> </div> <div style="border: 1px solid black;"> <h3>Media Card 2</h3> </div> <div style="border: 1px solid black;"> <h3>Media Card 3</h3> </div> </div> </section> 我面临的问题是标题应与第一个内容项(第一个媒体卡)的开头对齐,但我不想将其置于该部分本身的中心。 如何对齐标题以匹配第一个媒体卡的开头(请参见以下屏幕截图),而不是使其与内容居中? 我已经尝试过调整边距,但它似乎没有给我想要的“响应式”结果。是否有基于 Flexbox 的解决方案或简单的 CSS 方法可以实现此目的? 如有任何建议,我们将不胜感激! 如果我正确理解了你的作业: .section { display: flex; justify-content: center; /* Centers the entire section horizontally */ padding: 20px; } .section-container { display: flex; flex-direction: column; align-items: flex-start; /* Aligns the headline with the content */ } .section-headline { margin-bottom: 10px; /* Space between the headline and the media cards */ } .section-content { display: flex; justify-content: flex-start; gap: 20px; } .media-card { border: 1px solid black; padding: 10px; width: 200px; /* Adjust based on design */ } <section class="section"> <div class="section-container"> <h2 class="section-headline">Section Headline</h2> <div class="section-content"> <div class="media-card"> <h3>Media Card 1</h3> </div> <div class="media-card"> <h3>Media Card 2</h3> </div> <div class="media-card"> <h3>Media Card 3</h3> </div> </div> </div> </section>

回答 1 投票 0

在 Three.js 中创建沙滩伞的最有效资源方式

我是 Three.js 的新手,我发现它很棒,因为我可以轻松创建一个简单的场景。 我正在制作海滩场景,我想在场景中添加 10 万把海滩伞...

回答 1 投票 0

当我更改选项卡时,有没有办法在 iframe 中维护信息?

我有一个带有多个选项卡的网页。在其中一个中,我包含一个 iframe 作为管理某些属性的一种方式,因此我需要数据是持久的。每次我切换到另一个选项卡并c...

回答 1 投票 0

在React中获取子组件的第n个位置?

我有一个 PagesContainer 组件,它呈现多个页面组件,如下所示: ...

回答 1 投票 0

如何在图像中制作带有下一个/上一个箭头的幻灯片弹出窗口?

我想制作一个带有幻灯片的弹出窗口,但我有一个问题,我无法将导航箭头放置在图像容器内,因此当调整网站大小时,它们会保留在同一位置。 我...

回答 1 投票 0

PureScript:如何使构建系统产生多个js输出?

这似乎是一个基本问题,但我没有找到相关信息。网站通常不包含单个页面。例如。 StackOverflow 左侧有菜单,包含主页、问题、标签链接...

回答 2 投票 0

如何仅提交具有“disapaly:flex”的输入字段

抱歉,如果我以错误的方式提出了问题。 想象一下我有输入,有些是可见的(display:flex;),有些是不可见的(display:none;)。我可以使用 add ClassList 和 d...

回答 1 投票 0

PureScript 前端:如何创建多个输出文件?

这似乎是一个基本问题,但我没有找到任何相关信息。网站通常不包含单个页面。例如。 StackOverflow 左侧有菜单,其中包含主页、问题、标签链接...

回答 1 投票 0

为什么我的网页内容右侧在较小的浏览器/移动浏览器视图中消失?

我正在 Coursera.org 上学习 Meta 的前端 Web 开发课程,并且即将完成“深入 HTML 和 CSS”课程的客户项目。但是当我把浏览器变小或者

回答 1 投票 0

如何将错误消息从 Nodejs 后端打印到 MERN 中的前端

我正在开发 MERN 项目,我能够从后端发送错误消息,我可以在 Console => Network => Payload 中查看该消息,但我想在最后显示该错误消息...

回答 2 投票 0

vue.js 前端和 python 后端的最佳实践

我想要一个python脚本来触发vue.js组件的点击事件。 我见过的大多数方法似乎都是通过 .json 进行数据交换。前端的事件不是直接写入脚本,而是更新...

回答 1 投票 0

Web应用程序中用户的快捷方式配置保存在哪里?

最近,我一直在构建一个学习课程系统作为网络应用程序。现在我需要添加用户可以配置其快捷键/键绑定的功能(例如:Ctrl + B 表示“T...

回答 1 投票 0

如何向响应式菜单导航栏添加样式?

我创建了一个导航栏,左侧有徽标,右侧有链接,另外两个突出显示的链接,我添加了一个图标菜单,该菜单出现在小屏幕上,但是,问题是...

回答 1 投票 0

© www.soinside.com 2019 - 2024. All rights reserved.