bootstrap-4 相关问题

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

强制 Bootstrap 下拉菜单始终显示在底部并允许其离开屏幕

当视口底部没有空间容纳下拉菜单时,它会显示在下拉按钮的顶部。是否可以改变这种行为并使下拉菜单始终出现在

回答 4 投票 0

PDF blob 未在 Laravel 7 中的 Web 移动屏幕中显示

我知道这个问题可能已经被问过好几次了。 我想做的就是在移动屏幕网络浏览器中显示 PDF Blob。我尝试过使用嵌入标签和 iframe 标签,但它们都不起作用

回答 1 投票 0

如何将按钮放在图像上方(HTML/CSS)

我想通过 html/css 代码在图像轮播中的图像上方放置一些具有特定位置的按钮。我看过不同的帖子,但我无法解决我的问题....

回答 4 投票 0

如何在 Twitter bootstrap sass 中创建列(alpha 4)

我正在尝试使用 Bootstrap 提供的 make-col() Sass mixin。 http://v4-alpha.getbootstrap.com/layout/grid/。我想做的是创建两列。通过编译的类,我能够做到:...

回答 3 投票 0

轮播滑动动画在 Bootstrap 4.5.2 上不起作用

我正在学习 Bootstrap (v4.5.2),想要创建一个简单的轮播,可以为我的网站自动滑动。我转到 Bootstrap 文档并复制了

回答 4 投票 0

ngx-intl-tel-input下拉悬停效果如何禁用

问题: 当我将鼠标悬停在国家/地区列表中的下拉项目上时,我看到灰色背景颜色。我想禁用此悬停颜色,同时保持下拉菜单功能。我尝试使用 backgr...

回答 1 投票 0

我需要帮助在引导程序的帮助下创建一个反应表

我实际上想为我的反应项目创建这个表,但我在这个项目中面临问题,任何人都可以帮助我,我需要将其作为我部门的一个项目,但我不太熟悉...

回答 1 投票 0

如何使用 CodeIgniter 3 中的引导警报组件显示错误警报

我正在 Codeigniter 中创建上传、编辑和删除,我希望 bootstrap 警报应在 div 警报中显示上传错误(如果有)。下面提到了控制器的代码,请帮忙。 代码...

回答 2 投票 0

如何让导航栏显示在英雄上方

<!-- Nav bar Contains links to self and other pages --> <nav class="navbar navbar-expand-lg bg-body-tertiary"> <div class="container-fluid"> <a class="navbar-brand" href="./index.html"> <img src="#" alt="Logo" width="55" height="30" class="d-inline-block align-text-top"> ..... </a> <button class="navbar-toggler" type="button" data-bs-toggle="collapse" data-bs-target="#navbarNav" aria-controls="navbarNav" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <div class="collapse navbar-collapse" id="navbarNav"> <ul class="navbar-nav"> <li class="nav-item"> <a class="nav-link active" aria-current="page" href="#">Home</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Features</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Pricing</a> </li> <li class="nav-item"> <a class="nav-link disabled" aria-disabled="true">Disabled</a> </li> </ul> </div> </div> </nav> </header> <!-- Contains main Contents of the page --> <main> <!-- Hero 1 - Bootstrap Brain Component --> <section id = "hero" class="bsb-hero-1 px-3 bsb-overlay bsb-hover-pull" style="background-image: url('./assets/img/hero-img-1.jpg');"> <div class="container-fluid"> <div class="row justify-content-md-center"> <div class="col-12 col-md-11 col-lg-9 col-xl-7 col-xxl-6 text-center text-white"> <h2 class="display-3 fw-bold mb-3">Art of Design</h2> <p class="lead mb-5">Powerful, extensible, and feature-packed frontend toolkit. Build and customize with Sass, utilize prebuilt grid system and components, and bring projects to life with powerful JavaScript plugins.</p> <div class="d-grid gap-2 d-sm-flex justify-content-sm-center"> <button type="button" class="btn bsb-btn-xl btn-light gap-3">Free Consultation</button> </div> </div> </div> </div> </section> 我想让英雄部分固定在导航栏下方,当导航栏缩小时,我希望折叠项目显示在英雄上方,我应该怎么做才能使英雄位于导航栏下方? 要使用 Bootstrap 将小屏幕导航栏放置在英雄上方,可以使用 offcanvas 组件。您可以在这里查看: https://getbootstrap.com/docs/5.3/components/offcanvas/

回答 1 投票 0

设计具有两列的表单

我正在尝试在下面重新创建此页面 我对 Bootstrap 4 的网格系统非常熟悉,但我对表单感到非常困难。页面上的表单由一行和两个第 6 列组成。我是

回答 1 投票 0

引导程序中卡页眉和卡页脚之间的间隙

我正在尝试创建引导卡。我已经创建了卡页眉和卡页脚(但没有卡体),但我观察到页眉和页脚之间存在间隙。可能是因为没有卡体的缘故......

回答 1 投票 0

隐藏页面中的元素并使其仅在 Bootstrap 4 中打印时可见

有一个网页向用户显示信息。如果用户决定打印它,我想包含屏幕上不需要的附加信息,但在打印时会很有帮助。 在

回答 2 投票 0

隐藏页面中的div并使其仅在打印引导程序4上可见

有一个网页向用户显示信息。如果用户决定打印它,我想包含屏幕上不需要的附加信息,但在打印时会很有帮助。 在

回答 2 投票 0

在 Bootstrap 按钮内对齐文本

我注意到有类似的问题,但是我尝试了给定的解决方案,但没有任何效果* 我的自定义 CSS 文件 100% 正确链接到我正在处理的 html 文件 * 我正在使用 Bootstrap v4.3...

回答 4 投票 0

将整个变量传递给boostrap模态[重复]

我有一个主表页面,它加载查询结果,侧面有一个菜单(或者更确切地说是一组按钮)。我的问题是,当我从表中加载模态时,我只看到“id...

回答 1 投票 0

动态插入 DOM 元素后触发 Bootstrap JS

我使用 bootstrap-toogle 来制作精美的复选框。 它适用于页面加载,但如果我通过 JS 动态插入输入元素,它会显示默认复选框。 我使用 bootstrap-toogle 来制作精美的复选框。 它适用于页面加载,但如果我通过 JS 动态插入输入元素,它会显示默认复选框。 <link rel="stylesheet" href="https://gitcdn.github.io/bootstrap-toggle/2.2.2/css/bootstrap-toggle.min.css"> <script src="https://gitcdn.github.io/bootstrap-toggle/2.2.2/js/bootstrap-toggle.min.js"></script> <div class="row"><label for="button_1">Button 1 </label><input type="checkbox" id="button_1" name="button_1" checked="checked" data-toggle="toggle"></div> <div id="add">ADD button</div> <script type="text/javascript"> $(document).on("click", "#add", function() { var number = $("div.row").length + 1; var content = "<div class=\"row\"><label for=\"button_"+number+"\">Button "+number+" </label><input type=\"checkbox\" id=\"button_"+number+"\" name=\"button_"+number+"\" checked=\"checked\" data-toggle=\"toggle\"></div>"; $("div.row").last().after(content); }); </script> 这是一个小提琴:https://jsfiddle.net/8w3dk264/ 有没有办法可以在动态插入元素后触发 bootstrap-toogle 代码? 谢谢, 天哪,我应该阅读手册:( 就这么简单: $(elem).bootstrapToggle(); 对不起,

回答 1 投票 0

重新定位下拉元素,使它们位于下拉控件下

我继承了这个应用程序,而我只是 C# 和 Bootstrap 的初学者,所以请像我是白痴一样解释它,因为我就是。 :-) 我有一个读取其元素的下拉控件...

回答 1 投票 0

使用粘性第一列和行实现滚动`ngx-datatable`

当行数或列数增加时,内容不完全可见。如何实现滚动功能,确保滚动时第一列第一行保持固定(粘性)...

回答 1 投票 0

PHP 刀片并排对齐扩展布局

我正在尝试构建一个响应式仪表板,使用侧边栏在右侧进行导航,我将侧边栏构建为布局,并通过使用

回答 1 投票 0

Bootstrap 中的响应式标题布局问题:在移动视图中对齐徽标和搜索栏

我目前正在使用 Bootstrap 构建响应式标头。该布局在桌面版本上运行良好,但在移动视图中遇到一些对齐问题。这是关于什么的简要描述...

回答 1 投票 0

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