bootstrap-4 相关问题

Bootstrap 4是流行的前端组件库的第四个主要版本。 Bootstrap框架有助于创建响应迅速,移动优先的网站和Web应用程序。

如何在另一个页面而不是 welcome.blade.php 中设置 laravel 10 的默认登录和注册选项

如何在另一个页面而不是 welcome.blade.php 中设置 laravel 10 的默认登录和注册选项 我试过将默认的 welcome.blade.php 更改为我的登录页面 html 但登录并注册...

回答 0 投票 0

HTML 页面中插入符号的随机行

我正在使用 Django、bootstrap、HTML、CSS 和 JS 制作一个网络应用程序。我正在使用 Django 中的模板构建向表生成一些 API 结果。在桌子和桌子的 H1 之间,有我...

回答 1 投票 0

Bootstrap 4 theme-color("primary") 函数返回 bootstrap 默认原色而不是覆盖原色

在custom.scss中,修改theme-colors map @import "node_modules/bootstrap/scss/bootstrap"; $主题颜色:( “主要”:#3275B3, “中学”:#004f93 ); 在 main.scss 中,覆盖导入的 b...

回答 2 投票 0

我需要从html设计下面的图像表

我需要根据上图的表格结构制作一个html表格。我尝试了很多方法,但我做不到。 请帮我创建 Html 表。

回答 1 投票 0

是将 bootstrep 转换为 Material Design 的任何解决方案

我需要帮助我用 html、css 和 bootstrap 设计网站,现在我的客户告诉我不想要 bootstrap 所以是否有任何将 bootstrep 转换为 Material Design 的解决方案 是将 bootstrep 转换为

回答 0 投票 0

bootstrap 中的 collapsible 和 accordion 有什么区别?

bootstrap 中的 collapsible 和 accordion 有什么区别? 示例代码可折叠: bootstrap 中的collapsible 和accordion 有什么区别? 示例代码可折叠: <div class="panel-heading"> <h4 class="panel-title"> <a data-toggle="collapse" href="#collapse1">Collapsible panel</a> </h4> </div> <div id="collapse1" class="panel-collapse collapse"> <div class="panel-body">Panel Body</div> <div class="panel-footer">Panel Footer</div> </div> 手风琴示例代码 <h4 class="panel-title"> <a data-toggle="collapse" data-parent="#accordion" href="#collapse1"> Collapsible Group 1</a> </h4> </div> <div id="collapse1" class="panel-collapse collapse in"> <div class="panel-body">Hello World</div> </div> 根据 Bootstrap 4 Collapse,“Accordion 使用几个类和我们的 JavaScript 插件切换项目中内容的可见性。” [1] 当您想在隐藏和显示大量内容之间切换时,手风琴很有用。 [2] 在 bootstrap 上下文中,手风琴基本上是一个折叠按钮,里面有很多较小的信息。 Bootstrap 使用 card 制作手风琴。 Bootstrap 4 的片段 <div id="accordion" role="tablist"> <div class="card"> <div class="card-header" role="tab" id="headingOne"> <h5 class="mb-0"> <a data-toggle="collapse" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> Collapsible Group Item #1 </a> </h5> </div> <div id="collapseOne" class="collapse show" role="tabpanel" aria-labelledby="headingOne" data-parent="#accordion"> <div class="card-body"> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. </div> </div> </div> <div class="card"> <div class="card-header" role="tab" id="headingTwo"> <h5 class="mb-0"> <a class="collapsed" data-toggle="collapse" href="#collapseTwo" aria-expanded="false" aria-controls="collapseTwo"> Collapsible Group Item #2 </a> </h5> </div> <div id="collapseTwo" class="collapse" role="tabpanel" aria-labelledby="headingTwo" data-parent="#accordion"> <div class="card-body"> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. </div> </div> </div> <div class="card"> <div class="card-header" role="tab" id="headingThree"> <h5 class="mb-0"> <a class="collapsed" data-toggle="collapse" href="#collapseThree" aria-expanded="false" aria-controls="collapseThree"> Collapsible Group Item #3 </a> </h5> </div> <div id="collapseThree" class="collapse" role="tabpanel" aria-labelledby="headingThree" data-parent="#accordion"> <div class="card-body"> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. </div> </div> </div> </div> 在第一行,<div id="accordion" role="tablist">,这是data-parent所指的地方。 在第2行<div class="card">,我们使用了一个卡片类,来展示卡片的效果。 <div class="card-header" role="tab" id="headingOne"> <h5 class="mb-0"> <a data-toggle="collapse" href="#collapseOne" aria-expanded="true" aria-controls="collapseOne"> 这3行只是声明了一个新的idheadingOne,然后在a标签中,需要data-toggle="collapse" aria-expanded="true"来实现崩溃的效果,目标id为collapseOne。 一旦你按下那个a标签, <div id="collapseOne" class="collapse show" role="tabpanel" aria-labelledby="headingOne" data-parent="#accordion"> <div class="card-body"> Anim pariatur cliche reprehenderit, enim eiusmod high life accusamus terry richardson ad squid. 3 wolf moon officia aute, non cupidatat skateboard dolor brunch. Food truck quinoa nesciunt laborum eiusmod. Brunch 3 wolf moon tempor, sunt aliqua put a bird on it squid single-origin coffee nulla assumenda shoreditch et. Nihil anim keffiyeh helvetica, craft beer labore wes anderson cred nesciunt sapiente ea proident. Ad vegan excepteur butcher vice lomo. Leggings occaecat craft beer farm-to-table, raw denim aesthetic synth nesciunt you probably haven't heard of them accusamus labore sustainable VHS. </div> </div> <div id="collapseOne" class="collapse show" role="tabpanel" aria-labelledby="headingOne" data-parent="#accordion"> 这一行是自我解释的,data-parent参考id#accordion,labelledby="headingOne"和角色(tablist-选项卡的容器,tab-切换面板的可按下按钮,tabpanel-最初关闭的内容,由选项卡触发) 更多细节,直接看官方Bootstrap collpase 来源: https://getbootstrap.com/docs/4.0/components/collapse https://www.w3schools.com/howto/howto_js_accordion.asp

回答 1 投票 0

如何在角色 symfony 6 之间切换?

我想在 symfony 中的角色之间切换取决于 onAuthenticationSuccess.. 公共功能 onAuthenticationSuccess(请求 $request,TokenInterface $token,字符串 $firewallName):?响应 { 如果($

回答 1 投票 0

(解决)Django Bootstap Modals 无法呈现模态内容

我正在尝试使用 Django Bootstrap Modal 创建一个简单的弹出窗口。但是我无法在模态正文中获取链接内容,并且当我尝试访问那里的内容时。我很困惑为什么我的链接内容...

回答 2 投票 0

在导航栏中间切圆

所以我有一个 figma 原型可以遵循,他们希望我像这样在导航栏中间做一个切口: Figma : (https://i.stack.imgur.com/LJIHa.png) 那是我到目前为止的代码: @

回答 0 投票 0

如何在 jQuery 中显示两个引导日期选择器之间的年份

我在这里努力寻找日期选择器中从日期到日期之间的年数实际上我正在尝试打印从日期到日期之间选择的年数。我有...

回答 2 投票 0

(解决)Django Bootstap Modals 无法呈现模态内容

我正在尝试使用 Django Bootstrap Modal 创建一个简单的弹出窗口。但是我无法在模态正文中获取链接内容,并且当我尝试访问那里的内容时。我很困惑为什么我的链接内容...

回答 2 投票 0

如何让转换后的元素不被溢出自动切断?

我正在使用 Bootstrap 4 为朋友的个人网站制作模态画廊。我设置它以便图像在悬停时展开——但是当我设置

回答 1 投票 0

iPhone 11 / iOS 16.2 上的错误显示选择字段选项

选择选项在 iPhone 11 / iOS 16.2 上显示不正确 图标“check”被选项值重叠: 带有错误的图像选择选项 HTML 代码: 选择选项在 iPhone 11 / iOS 16.2 上显示不正确 图标“检查”被选项值重叠: HTML代码: <div class="form-group d-inline-flex mb-0 form-group-quantity"> <label for="quantity_wanted">Qty</label> <select class="custom-select custom-select-sm" name="product-quantity" id="quantity_wanted" data-product-id="27" value="1"> <option value="1" selected="">1</option> <option value="2">2</option> <option value="3">3</option> <option value="4">4</option> <option value="5">5</option> <option value="6">6</option> <option value="7">7</option> <option value="8">8</option> <option value="9">9</option> <option value="10">10</option> </select> </div> 我正在使用 Bootstrap v4.6.0。在少数设备上进行了测试,仅在 iPhone 11 上重现了该错误。 有人知道为什么会出现这个问题吗? 默认 iPhone 的 select comportment 预计:

回答 0 投票 0

如何在 jQuery ajax 调用中迭代对象数组

我正在尝试在 jQuery ajax 调用中迭代 API 响应,但我得到所有元素的未定义数据。如何在 jQuery 中迭代对象数组。我是 api ajax 调用中迭代的新手 我要

回答 1 投票 0

我如何编写 selenium webdriver 脚本来增加迷你购物车部分数量输入字段中的项目数量?

我试过使用 cssSelector 但没有自动增加值。 driver.findElement(By.cssSelector("div.fixed-units > input[id$='in']")).sendKeys("5"); 我想增加数量...

回答 0 投票 0

如何自动滚动 CSS overflow 属性设置为 auto 的元素

我正在创建一个推荐部分,其中有两个,我希望两个 div 都自动滚动,并在高度固定的 div 内继续滚动 我不知道为什么,但只有一个 div 移动...

回答 2 投票 0

自动滚动 <DIV> CSS overflow 属性设置为 auto

我正在创建一个推荐部分,其中有两个,我希望两个 div 都自动滚动,并在高度固定的 div 旁边继续滚动 我不知道为什么,但只有一个 div 移动...

回答 2 投票 0

从 JQuery Multiselect 中隐藏底部状态栏

我用 Bootstap 设置了我的多选下拉菜单,但是底部状态栏是破坏用户体验的东西,有人能弄清楚如何关闭它吗? 这是Bootstap multiselect的配置 变种配置= {...

回答 0 投票 0

有什么办法可以根据localStorage数据激活isOpen类

我尝试使用 addEventListener 但它没有按预期工作它根本没有工作但是我想做的是如果用户激活开关按钮然后幻灯片将打开并且当你.. .

回答 0 投票 0

文本框边框阴影未满跨度

如何使文本框边框阴影充满跨度? 我的代码: 如何使文本框边框阴影充满跨度? 我的代码: <div class="input-group"> <div class="input-group"> <input class="form-control shadow-none" placeholder="Search..."> <span class="input-group-text"><i class="fa fa-search"></i></span> </div> </div>

回答 0 投票 0

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