bootstrap-4 相关问题

.react-bootstrap 上的flex-grow-1 <Row> 未填充垂直空间

我正在努力在Bootstrap 4.6.0（使用react-bootstrap 1.5.2）中获取.flex-grow-1，以使布局上的组件扩展以填充剩余的可用垂直空间。 “引导”：...

将文本在文本框的下方和右侧对齐

我试图显示可调整大小的文本框的字符限制并将其与框的右下角对齐，就像链接（图像）中的图像一样。但是，我找不到一种方法来使其成为可能。我

如何在 Angular-Slickgrid 中获取列标题的工具提示？

列标题具有类“.slick-column-name” 我添加了这个 jquery - var text = $(".slick-column-name").text(); $(".slick-column-name").tooltip({ 标题: 文本 }); 乙...

在 pythonanywhere 中托管时未找到 Bootstrap CSS

我正在尝试制作一个包含一些数据库的管理面板。我使用flask-admin自动生成管理面板。当我在我的 PC 本地运行服务器时，引导样本正在加载...

滑动手势在 Bootstrap 4 轮播中不起作用

我最近使用 Dreamweaver 构建了一个 Bootstrap 4.0 网站，其中包含多个轮播。我已经在代码中添加了 data-touch=”true” 属性，但是滑动手势在 mo...

为什么此 Bootstrap 导航栏的切换按钮不起作用？

我正在尝试创建引导导航栏，但切换按钮不起作用。我在 body 标签上使用了 .sidebar-collapse 类，因此当我单击 tog 时，数据应该出现在右侧...

如何使用JavaScript应用到click toast

我陷入了一个与JavaScript相关的问题，如何应用toast。 我需要帮助使用 JavaScript 应用点击 toast，但是只有当给定条件不成立时，toast 才会出现...

bootstrap5中设置图片宽高属性的类是哪个？

我在 HTML 页面的标签内添加了一个标签。我需要使用 Bootstrap 类设置图像宽度和高度。我怎样才能做到这一点？有人有想法吗？ 我在下面分享我的代码： 我在 HTML 页面的标签内添加了一个标签。我需要使用 Bootstrap 类设置图像宽度和高度。我怎样才能做到这一点？有人有想法吗？ 我在下面分享我的代码： <div class="col"> <div class="card border border-2 border-danger w-75 mt-3"> <img src="/Images/oppo-a31-2020-128-gb-black-6-gb-ram-.jpg" class="mx-auto d-block img-fluid" style="height:200px; width:200px;" alt="xxx"> <div class="card-body text-center"> <h5 class="card-title">Oppo A13</h5> <p class="card-text" >Our Price: To see product details, add this item to your cart. You can always remove it later.</p> <a href="#" class="btn btn-primary">Buy Now</a> </div> </div> </div> 如果你想OVERRIDE Bootstrap，你需要做你正在做的事情：将style="height:200px; width:200px;"添加到你的<img>元素。 否则，对于 Bootstrap 的“默认”图像样式，请查看此处： https://getbootstrap.com/docs/5.0/content/images/ 响应式图片 Bootstrap 中的图像通过 .img-fluid 进行响应。这 应用最大宽度：100%；和高度：自动；到图像，以便它 随父元素缩放。 图像缩略图 除了我们的边界半径实用程序之外，您还可以使用 .img-thumbnail 为图像提供圆形 1px 边框外观。 对齐图像 将图像与辅助浮动类或文本对齐类对齐。 块级图像可以使用 .mx-auto margin 实用程序居中 类。 Sass 变量 变量可用于图像缩略图。 $thumbnail-padding: .25rem; $thumbnail-bg: $body-bg; $thumbnail-border-width: $border-width; $thumbnail-border-color: $gray-300; $thumbnail-border-radius: $border-radius; $thumbnail-box-shadow: $box-shadow-sm;

复选框引导程序 - 如何获取值[重复]

我有以下html代码： 我有以下html代码： <div type="checkbox" id="myCheckbox" name="bootStrap1" class="bootstrap-switch bootstrap-switch-wrapper bootstrap-switch-animate bootstrap-switch-on"> <div class="bootstrap-switch-container" style="width: 118px; margin-left: 0px;"> <span class="bootstrap-switch-handle-on bootstrap-switch-primary" style="width: 50px;">ON</span> <span class="bootstrap-switch-label" style="width: 30px;">&nbsp;</span> <span class="bootstrap-switch-handle-off bootstrap-switch-default" style="width: 50px;">OFF</span> </div> </div> 如何获取检查值。我尝试遵循但没有成功。很高兴获得一些帮助。 value = $('#myCheckbox').val(); value = document.getElementById('myCheckbox').checked; // Get the checkbox element const checkbox = document.getElementById('myCheckbox'); // Get the checked value const checked = checkbox.checked; if (checked) { // The checkbox is checked } else { // The checkbox is not checked }

如何在带有 dompdf 的 PDF 中使用 bootstrap？

我正在尝试生成一个包含数据库信息的报告，并且我可以使用 HTML 和 boostrap 正确显示它，但是当我尝试渲染我的 html 文件时，引导程序停止工作。 我正在尝试生成一个包含来自数据库的信息的报告，并且我可以使用 HTML 和 boostrap 正确显示它，但是当我尝试渲染我的 html 文件时，引导程序停止工作。 <?php //this is my html: ob_start(); ?> <!-- All my file goes here, including the <link></link> to the boostrap --> <?php $html = ob_get_clean() ?> 然后，在另一个文件（我用来创建 PDF）中我这样做了： <?php require_once 'route/to/dompdf/autoload.inc.php'; use Dompdf\Dompdf; $dompdf = new Dompdf(); include "firstFileWithHtml.php"; $options = $dompdf->getOptions(); $options->set(array('isRemoteEnabled' => true)); $dompdf->setOptions($options); $dompdf->loadHtml($html); $dompdf->setPaper("letter"); $dompdf->render(); $dompdf->stream("file_pdf", array("Attachment" =>false)); ?> 它会生成 PDF 预览，只是没有 boostrap。 我缺少一个选项吗？ 我尝试下载 bootstrap，尝试使用其他版本（4.3.1、5.0.2、5.3.0），我尝试使用 CDN，但没有任何效果。 我也尝试了这个答案中的解决方案，但是将CSS放在同一个文件中不起作用，并且方法set_base_path已被弃用。 我找到了解决方案，感谢@ceejayoz 的提示。 如果我这样放置 href： <link rel="stylesheet" href=""../user/bootstrap-5.0.2-dist/css/bootstrap.min.css"> 没成功。 但如果我用这个代替： <link rel="stylesheet" href="http://<?php echo $_SERVER['HTTP_HOST']; ?>/PROJECT/user/bootstrap-5.0.2-dist/css/bootstrap.min.css"> 它就像一个魅力。 我能够使 bootstrap 5 工作。我正在做一个 Laravel 项目，需要 dompdf。 首先，获取Bootstrap 5缩小版的内容 $bootstrap5 = file_get_contents(public_path() . '/css/bootstrap.min.css'); 然后将“$bootstrap5”传递到$data变量中 $data = [ 'professions' => $professions, 'logo' => $imageLogo, 'css' => $bootstrap5, ]; 然后用$data加载PDF $pdf = Pdf::setPaper('letter', 'portrait')->setOptions(['dpi' => 100, 'defaultFont' => 'Nunito, sans-serif', 'isHtml5ParserEnabled' => true, 'isRemoteEnabled' => true, 'isJavascriptEnabled' => true]) ->loadView('reports.staffing-report', $data); 在我的staffing-report.php中，我在内部添加了一个样式标签，并从$data中呼应了“css”： <style> {{ $css }} </style>

如何将引导工具提示 CSS 仅应用于特定元素？

我想创建两个带有引导工具提示的元素：一个与左上角对齐（tr），一个位于顶部（img）。 要素如下： 我想创建两个带有引导工具提示的元素：一个与左上角对齐 (tr)，一个位于顶部 (img)。 要素如下： <tr data-toggle="tooltip" data-placement="top" title="title2"> <th>test</th> <th>test</th> <tr/> <img src="link.png" data-toggle="tooltip" data-placement="top" title="title1"/> 下面的内容可以使其工作，但它将所有工具提示的工具提示设置为“左上角”。我只想要 tr 元素： .tooltip { left:20px !important; } 我尝试过使用以下两种方法，但都不起作用： tr.tooltip { left:20px !important; } .tooltip tr { left:20px !important; } 创建包含要添加工具提示的元素的 HTML 结构。例如： <button id="myButton" data-toggle="tooltip" title="This is a tooltip">Hover me</button> 然后添加 jQuery 代码 <script> $(document).ready(function () { $('#myButton').tooltip(); }); </script> 有了这个你就会明白了，只需要更改 ID 并且我认为你已经插入了 Bootstrap 文件。

Bootstrap 4 NavBar 与 React <Link/> 组件

我正在尝试构建一个 Bootstrap 4 NavBar，它将使用 React-router 中的 ReactJS 组件而不是原始的 类。 目前我在构建组件时遇到困难 我正在尝试构建一个 Bootstrap 4 NavBar，它将使用 React-router 中的 ReactJS <Link> 组件，而不是原始的 <li> 类。 目前我在正确构建组件时遇到了麻烦，因为最终 ReactJS 组件没有达到预期的行为。 让我们从最初的 Bootstrap 4 NavBar 示例开始： <nav class="navbar navbar-toggleable-md navbar-light bg-faded"> <button class="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span class="navbar-toggler-icon"></span> </button> <a class="navbar-brand" href="#">Navbar</a> <div class="collapse navbar-collapse" id="navbarSupportedContent"> <ul class="navbar-nav mr-auto"> <li class="nav-item active"> <a class="nav-link" href="#">Home <span class="sr-only">(current)</span></a> </li> <li class="nav-item"> <a class="nav-link" href="#">Link</a> </li> <li class="nav-item"> <a class="nav-link disabled" href="#">Disabled</a> </li> </ul> <form class="form-inline my-2 my-lg-0"> <input class="form-control mr-sm-2" type="text" placeholder="Search"> <button class="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button> </form> </div> </nav> 这正在迁移到 ReactJS 组件，如下所示： import React from 'react'; import Link from 'react-router-dom/Link'; function Menu() { return ( <div> <nav className="navbar navbar-toggleable-md navbar-light bg-faded"> <button className="navbar-toggler navbar-toggler-right" type="button" data-toggle="collapse" data-target="#navbarSupportedContent" aria-controls="navbarSupportedContent" aria-expanded="false" aria-label="Toggle navigation"> <span className="navbar-toggler-icon"></span> </button> <a className="navbar-brand" href="#">Navbar</a> <div className="collapse navbar-collapse" id="navbarSupportedContent"> <ul className="navbar-nav mr-auto"> <span className="nav-item active"> <Link className="nav-link" to="/">Home <span className="sr-only">(current)</span></Link> </span> <span className="nav-item"> <Link className="nav-link" to="/counter">Counter</Link> </span> <span className="nav-item"> <Link className="nav-link disabled" to="/about">About</Link> </span> </ul> <form className="form-inline my-2 my-lg-0"> <input className="form-control mr-sm-2" type="text" placeholder="Search" /> <button className="btn btn-outline-success my-2 my-sm-0" type="submit">Search</button> </form> </div> </nav> </div> ); } export default Menu; 虽然它可以运行，但许多格式都会丢失，并且“导航链接禁用”等一些功能无法正常工作（您可以单击“关于”，它会转到所需的页面）。 我确信我的转换是错误的。如何修复组件代码以便在不使用 React 的情况下正确反映原始行为？ 也许你已经解决了。这是 Bootstrap 4 的一个工作示例： import React from 'react'; import { render } from 'react-dom'; import { BrowserRouter, Route, Switch, Link } from 'react-router-dom'; const AppPage = () => <h1>React Router 4 & Bootstrap 4</h1> const HomePage = () => <h1>Welcome Home !</h1> const AboutPage = () => <h1>About Us</h1> const OneMorePage = () => <h1>One More Page !</h1> const PrimaryLayout = () => ( <div> <nav className="navbar navbar-expand-md navbar-dark bg-dark"> <Link className="navbar-brand" to="/">App</Link> <button type="button" className="navbar-toggler" data-toggle="collapse" data-target="#navbarNav"> <span className="navbar-toggler-icon"></span> </button> <div className="collapse navbar-collapse" id="navbarNav"> <ul className="navbar-nav mr-auto"> <li className="nav-item"><Link className="nav-link" to="/home">Home</Link></li> <li className="nav-item"><Link className="nav-link" to="/about">About</Link></li> <li className="nav-item"><Link className="nav-link" to="/one">More</Link></li> </ul> </div> </nav> <div className="container-fluid"> <Switch> <Route path="/" exact component={AppPage} /> <Route path="/home" component={HomePage} /> <Route path="/about" component={AboutPage} /> <Route path="/one" component={OneMorePage} /> </Switch> </div> </div> ) const App = () => ( <BrowserRouter> <PrimaryLayout /> </BrowserRouter> ) render(<App />, document.getElementById('root')) 对于这个特定的用例，有一个简单的解决方案。 只需将其添加到您的 CSS 中： .nav-link.disabled { pointer-events: none }. 也就是说，从长远来看，我强烈建议使用基于引导的 React 组件库。我个人喜欢https://reactstrap.github.io/. 问题是 Bootstrap 也有一个 Javascript 组件，它在 React 中不起作用，因为它与 React's Javascript 发生冲突。 CSS 部分有效，这就是您所看到的。 你应该使用类似 React-Bootstrap- https://react-bootstrap.github.io/ 的东西。这些都是编写为 Bootstrap 组件的所有 React 组件，因此您可以通过在 React 中导入和使用它们来以标准 JSX 方式使用它们。

密码字段上的眼睛图标有时可见，有时不可见

我有登录表单的代码密码（我使用的是bootstrap 4） 密码  *... 我有登录表单的代码密码（我使用的是bootstrap 4） <div class="form-account-label-input"> <label> Password <span class="star-red">&nbsp;*</span></label> <input type="password" id="Password" name="Password" class="w-100"> </div> 当我开始插入密码时，会出现一个图标眼睛，如下所示 我没有在我的代码上设置任何眼睛图标。它是从哪里打来的？问题是这个眼睛图标有时出现有时不出现。所以我想知道它是从哪里来的 禁用并在代码中自己设置一个眼睛图标？ 更新 我发现我只在 Edge 浏览器上有它，而不是在 chrome 上 **Try this** <!DOCTYPE html> <html lang="en"> <head> <link rel="stylesheet" href= "https://cdn.jsdelivr.net/npm/[email protected]/font/bootstrap- icons.css" /> <link rel="stylesheet" href="https://stackpath.bootstrapcdn.com/bootstrap/4.3.1/css/bootstrap.min.css" integrity="sha384 ggOyR0iXCbMQv3Xipma34MD+dH/1fQ784/j6cY/iJTQUOhcWr7x9JvoRxT2MZw1T" crossorigin="anonymous"> <style> form i { margin-left: -30px; <h1>Sign In</h1> cursor: pointer; } </style> </head> <body> <div class="container"> <form> <p> <label>Password:</label> <input type="password" name="password" id="password" /> <i class="bi bi-eye-slash" id="togglePassword"></i> </p> </form> </div> <script> const togglePassword = document .querySelector('#togglePassword'); const password = document.querySelector('#password'); togglePassword.addEventListener('click', () => { // Toggle the type attribute using // getAttribure() method const type = password .getAttribute('type') === 'password' ? 'text' : 'password'; password.setAttribute('type', type); // Toggle the eye and bi-eye icon this.classList.toggle('bi-eye'); }); </script> </body> </html> 您可以尝试以下代码： 风格： /* password toggle start */ .password-section { position: relative; display: inline-block; } .password-section .fa-eye { position: absolute; top: 76%; right: 22px; /* Adjust this value to control the icon's position */ transform: translateY(-50%); cursor: pointer; } .password-section .fa-eye-slash { position: absolute; top: 76%; right: 22px; /* Adjust this value to control the icon's position */ transform: translateY(-50%); cursor: pointer; } /* password toggle end */ HTML： <div class="col-xs-12 password-section"> <input class="form-control input-lg" id="password-field" name="password" type="Password"> <span class="fa fa-eye " id="togglePassword" ></span> </div> Jquery： <script> $(document).ready(function () { // Toggle Password Start $("#togglePassword").removeClass("fa fa-eye").addClass("fa fa-eye-slash"); $("#togglePassword").click(function() { const passwordInput = $("#password-field"); const type = passwordInput.attr("type"); if (type === "password") { passwordInput.attr("type", "text"); $("#togglePassword").removeClass("fa fa-eye-slash").addClass("fa fa-eye"); } else { passwordInput.attr("type", "password"); $("#togglePassword").removeClass("fa fa-eye").addClass("fa fa-eye-slash"); } }); // Toggle Password End }); </script>

引导程序并排字段对齐缺失标签的问题

我正在尝试创建一个简单的引导布局，但在对齐没有标签的控件时遇到问题。 我的问题在下面的小提琴中复制。第三栏的控件（文本框和按钮）...

我们如何使用ngx-fomly/bootstrap在表单中添加带有文本的图标

没有获得任何文档/信息来使用 ngx-formly/bootstrap 库在表单上添加带有文本的图标。 还尝试使用插件添加图标，但在我的项目中，表单上仅显示两个图标（f...

如何设置弹出图像

<div className="Image popup"> <Modal isOpen={modalIsOpen} onRequestClose={closeModal} contentLabel="Image popup" > <img src="../img/navratri-1.png" alt="Image popup" /> <button onClick={closeModal}>Close</button> </Modal> </div>; useEffect(() => { const hasShownImagePopup = localStorage.getItem("hasShownImagePopup"); if (!hasShownImagePopup) { localStorage.setItem("hasShownImagePopup", "true"); setModalIsOpen(true); } }, []); const closeModal = () => { setModalIsOpen(false); }; 在此，我期望屏幕上显示弹出图像。就像一个网站，当用户进入主页时，显示图像，当用户单击关闭按钮时，图像被关闭。 if (!hasShownImagePopup) { 这里，!hasShownImagePopup仅在true为“”时返回hasShownImagePopup。 因为在本地存储中，数据是以字符串格式存储的。 所以，我们应该检查 hasShownImagePopup 是否不是 "true"。 if (hasShownImagePopup !== "true") { 此外，当您关闭模态框时，您应该将 LocalStorage 中的 hasShownImagePopup 设置为 "false"。当您再次访问该页面时，这将使弹出窗口再次显示。 const closeModal = () => { localStorage.setItem("hasShownImagePopup", "false"); setModalIsOpen(false); }; 这是一个 CodePen 示例。 你可以尝试下面的代码片段吗 import React, { useState, useEffect } from 'react'; import Modal from 'react-modal'; const ImagePopup = () => { const [modalIsOpen, setModalIsOpen] = useState(false); useEffect(() => { const hasShownImagePopup = localStorage.getItem('hasShownImagePopup'); if (!hasShownImagePopup) { localStorage.setItem('hasShownImagePopup', 'true'); setModalIsOpen(true); } }, []); const closeModal = () => { setModalIsOpen(false); }; return ( <div className="Image popup"> <Modal isOpen={modalIsOpen} onRequestClose={closeModal} contentLabel="Image popup" > <img src={require('../img/navratri-1.png')} alt="Image popup" /> <button onClick={closeModal}>Close</button> </Modal> </div> ); }; export default ImagePopup;

Bootstrap4向div添加滚动条

我在div内使用堆叠的药丸。问题是，有时 div 中包含很多药丸。如何为其添加滚动条？ 我正在div内使用堆叠药丸。问题是，有时div含有很多药丸。如何为其添加滚动条？ <div class="row col-md-2"> <ul class="nav nav-pills nav-stacked"> <li class="nav-item"> <a class="nav-link active" href="#">Active</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Link</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Link</a> </li> <li class="nav-item"> <a class="nav-link disabled" href="#">Disabled</a> </li> </ul> </div> 我可以为 div 添加一个类以使堆叠的药丸可滚动吗？ 是的，有可能， 只需添加一个类似 anyclass 的类 并给出一些CSS样式。 直播 .anyClass { height:150px; overflow-y: scroll; } .anyClass { height:150px; overflow-y: scroll; } <link href="https://maxcdn.bootstrapcdn.com/bootstrap/4.0.0-alpha.5/css/bootstrap.min.css" rel="stylesheet"/> <div class=" col-md-2"> <ul class="nav nav-pills nav-stacked anyClass"> <li class="nav-item"> <a class="nav-link active" href="#">Active</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Link</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Link</a> </li><li class="nav-item"> <a class="nav-link" href="#">Link</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Link</a> </li><li class="nav-item"> <a class="nav-link" href="#">Link</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Link</a> </li><li class="nav-item"> <a class="nav-link" href="#">Link</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Link</a> </li><li class="nav-item"> <a class="nav-link" href="#">Link</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Link</a> </li> <li class="nav-item"> <a class="nav-link disabled" href="#">Disabled</a> </li> </ul> </div> 在包含元素的元素上使用 overflow-y: scroll 属性。 overflow-y属性指定当块级元素在顶部和底部边缘溢出时是否裁剪内容、添加滚动条或显示溢出内容。 有时，在 Overflow-y 属性旁边放置元素的高度很有趣，如下例所示： <ul class="nav nav-pills nav-stacked" style="height: 250px; overflow-y: scroll;"> <li class="nav-item"> <a class="nav-link active" href="#">Active</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Link</a> </li> <li class="nav-item"> <a class="nav-link" href="#">Link</a> </li> <li class="nav-item"> <a class="nav-link disabled" href="#">Disabled</a> </li> </ul> .Scroll { height:600px; overflow-y: scroll; } <!DOCTYPE html> <html> <head> <script src="https://ajax.googleapis.com/ajax/libs/jquery/3.3.1/jquery.min.js"></script> <script> </script> </head> <body> <h1>Smooth Scroll</h1> <div class="Scroll"> <div class="main" id="section1"> <h2>Section 1</h2> <p>Click on the link to see the "smooth" scrolling effect.</p> <p>Note: Remove the scroll-behavior property to remove smooth scrolling.</p> </div> <div class="main" id="section2"> <h2>Section 2</h2> <p>Knowing how to write a paragraph is incredibly important. It’s a basic aspect of writing, and it is something that everyone should know how to do. There is a specific structure that you have to follow when you’re writing a paragraph. This structure helps make it easier for the reader to understand what is going on. Through writing good paragraphs, a person can communicate a lot better through their writing.</p> </div> <div class="main" id="section3"> <h2>Section 3</h2> <p>Knowing how to write a paragraph is incredibly important. It’s a basic aspect of writing, and it is something that everyone should know how to do. There is a specific structure that you have to follow when you’re writing a paragraph. This structure helps make it easier for the reader to understand what is going on. Through writing good paragraphs, a person can communicate a lot better through their writing.</p> </div> <div class="main" id="section4"> <h2>Section 4</h2> <p>Knowing how to write a paragraph is incredibly important. It’s a basic aspect of writing, and it is something that everyone should know how to do. There is a specific structure that you have to follow when you’re writing a paragraph. This structure helps make it easier for the reader to understand what is going on. Through writing good paragraphs, a person can communicate a lot better through their writing.</p> </div> <div class="main" id="section5"> <h2>Section 5</h2> <a href="#section1">Click Me to Smooth Scroll to Section 1 Above</a> </div> <div class="main" id="section6"> <h2>Section 6</h2> <p>Knowing how to write a paragraph is incredibly important. It’s a basic aspect of writing, and it is something that everyone should know how to do. There is a specific structure that you have to follow when you’re writing a paragraph. This structure helps make it easier for the reader to understand what is going on. Through writing good paragraphs, a person can communicate a lot better through their writing.</p> </div> <div class="main" id="section7"> <h2>Section 7</h2> <a href="#section1">Click Me to Smooth Scroll to Section 1 Above</a> </div> </div> </body> </html> <div class="overflow-auto p-3 mb-3 mb-md-0 mr-md-3 bg-light" style="max-width: 260px; max-height: 100px;"> <strong>Column 0 </strong><br> <strong>Column 1</strong><br> <strong>Column 2</strong><br> <strong>Column 3</strong><br> <strong>Column 4</strong><br> <strong>Column 5</strong><br> <strong>Column 6</strong><br> <strong>Column 7</strong><br> <strong>Column 8</strong><br> <strong>Column 9</strong><br> <strong>Column 10</strong><br> <strong>Column 11</strong><br> <strong>Column 12</strong><br> <strong>Column 13</strong><br> </div> </div> 添加一个类，如 addScroll .addScroll { height:300px; overflow-y: auto; }

如何根据引导断点将条件样式与 Vuejs 进行 v 绑定？

我正在尝试为不同的引导断点分配动态样式。如果显示宽度不同，则更改位置等。所以我在 vue 中应用 v-bind 样式指令。我是不是...

我的引导程序无法在 MAC 操作系统上运行

这是一个奇怪的问题，我的引导程序在 mac OS 上不起作用，但在 linux ubuntu 上（在我的另一台笔记本电脑上）上正常。 在这里我将附上一张图像（层次结构文件）。 这是我导入的方式

使用 Bootstrap 4 在 html 页面中设计我的仪表板

我需要帮助，使用 Bootstrap 4 设计我的 html 仪表板。 下面的代码是我想要的样子。 换句话说，我希望文本尽可能大，并且内容很少......