Bootstrap 4 - 选择题8 Feb 2025 | 16 分钟阅读 1) 关于 Bootstrap 4，以下哪些陈述是正确的？
答案： d. 以上所有 解释：Bootstrap 4 是一个完全开源且免费使用的产品。它特别有用且高效，因为它还提供了构建或创建响应式网页的能力。 2) Bootstrap 的开发者是谁？
答案：a. Mark Otto 和 Jacob Thornton 解释：Bootstrap 最初名为 Twitter Blueprint。它由 Mark Otto 和 Jacob Thornton 开发，于 2011 年 8 月 19 日发布。 3) 以下哪个上下文类用于显示警告？
答案：b. .danger 解释：上下文类 .danger 可用于指示 Bootstrap 4 中的危险或潜在的负面操作。 4) 在 Bootstrap 4 中，可以使用以下哪个类来制作圆角图像？
答案：b. .rounded 解释：.rounded 类负责为图像添加圆角。 .rounded 类可用于使图像边角变圆，这也能增强网站的整体外观。 5) Bootstrap 4 中 <h3> 的默认字体大小是多少？
答案：b. 28 像素 解释：Bootstrap 4 中 <h3> 的默认字体大小是 1.75rem 或 28px。 6) 以下 meta 标签有什么作用？ <meta name="viewport" content="width=device-width, initial-scale=1">
答案：c. 阻止浏览器在移动设备上缩放桌面网站 解释：meta 标签 - <meta name="viewport" content="width=device-width, initial-scale=1"> 告诉浏览器如何控制页面尺寸和缩放。 在这里，width=device-width 部分将页面宽度设置为跟随设备的屏幕宽度，这会因设备而异。 initial-scale=1.0 部分设置了页面首次加载时的初始缩放级别。 因此，此 meta 标签可阻止浏览器在移动设备上缩放桌面网站。 7) Bootstrap 4 中使用 Glyphicons 是为了什么？
答案：d. 提供不同图标的目的 解释：Glyphicons 在 Bootstrap 中非常重要，因为它可以用于在 Bootstrap 中为不同目的提供不同的图标。然而，Bootstrap 4 不支持 Glyphicons。要插入图标，用户必须使用 Font Awesome 等免费图标库。要使用 Font Awesome 中的图标，用户必须将以下内容添加到 HTML 页面 <link rel="stylesheet" href="https://use.fontawesome.com/releases/v5.7.0/css/all.css" crossorigin="anonymous"> 8) 以下哪个类可用于使网页中的图像和其他内容自动适应屏幕大小？
答案：b. .img-fluid 解释：.img-fluid 可用于使网页中的图像和其他内容自动适应屏幕大小。此外，它还设置 max-width: 100%; 和 height: auto; 9) 关于 Bootstrap 4 中的 Jumbotron，以下哪个陈述是正确的？
答案：c. a 和 b 都正确。 解释：Bootstrap 4 中的 Jumbotron 可用于使用 .jumbotron 类创建一个容器，该容器可用于增大标题的大小，并插入大量边距，可广泛用于登陆页面的控制。 10) Bootstrap 4 中 <h5> 的正确标题大小是多少？
答案：a. 20 像素 解释：默认情况下，Bootstrap 4 中 <h5> 的标题大小为 20 像素。 11) 以下哪个插件可用于像幻灯片一样循环显示元素？
答案：b. Carousel 解释：Carousel 是可用于创建像幻灯片一样循环显示元素的插件。.carousel 是可用于创建幻灯片的类。 12) 以下哪个布局可用于在 Bootstrap 4 中提供 100% 宽度？
答案：a. 流式布局 解释：在 Bootstrap 4 中，用户可以使用 .container-fluid 类来创建流式布局，该布局可在所有设备尺寸（超小、小、中、大和超大）上使用视口 100% 的宽度。该类是 .container-fluid，它创建的宽度为 100%，而不是不同视口尺寸的不同宽度。此外，布局仍将保持响应式。 使用的类是 .container-fluid，它创建的宽度为 100%，而不是不同视口尺寸的不同宽度。此外，布局仍将保持响应式。 13) 以下哪个网格类可用于桌面？
答案：a. md 解释：在 Bootstrap 4 中，网格系统包含四个类：xs、sm、md 和 lg。xs 类用于手机（超小屏幕），sm 类用于平板电脑（小屏幕），md 类用于中等屏幕，如桌面，lg 类用于大型屏幕，用于更大的台式机。 14) 在 Bootstrap 4 中，内容可以放置在以下哪个元素内？
答案：a. 列 (Columns) 解释：网页中的内容可以放置在 Bootstrap 4 中的列元素内。 15) ID 和 Class 之间的主要区别是什么？
答案：b. ID 在每个页面中只能使用一次，而 Class 可在页面中多次使用，一个元素可以有多个 Class，但只能有一个 ID 解释：ID 和 Class 的主要区别在于 ID 在网页中只能使用一次，而 Class 可以使用多次。此外，一个元素也可以有多个类，但它只能有一个 ID。 16) Bootstrap 4 中有多少种容器类？
答案：b. 2 解释：在 Bootstrap 4 中，容器类主要用于设置边距，以处理布局的响应式行为。它用于创建盒式内容。Bootstrap 中主要有两种容器类：
17) 以下哪些类是上下文类？
答案：d. 所有给定的选项都正确 解释：上下文类负责更改表格行和单个单元格的背景颜色。可使用的类有：
18) 徽章 (badges) 可以用在按钮类中吗？
答案： a. 真 解释：是的，徽章可以用来创建按钮类。 在 Bootstrap 4 中，在按钮中创建徽章的语法如下所示 <button type="button" class="btn btn-primary"> Messages <span class="badge badge-light">5</span> </button> 19) Bootstrap 主要用于前端开发吗？
答案： a. 真 解释：Bootstrap 主要仅用于前端开发。它提供了多种选项来创建美观高效的网页。 20) Bootstrap 最初被命名为什么？
答案：a. Twitter Blueprint 解释：Bootstrap 最初于 2011 年发布，由 Twitter 的 Mark Otto 和 Jacob Thornton 创建，旨在鼓励内部工具之间的一致性。最初，它被命名为“Twitter Blueprint”，后来更名为 Bootstrap。 21) 以下哪个版本的 Bootstrap 使用了扁平化设计？
答案：b. Bootstrap 3 解释：Bootstrap 3 使用了扁平化设计。它重新设计了组件以使用扁平化设计和移动优先的方法。 22) Bootstrap 4 支持以下哪些选项？
答案：c. a 和 b 都支持 解释：弹性盒子模型（Flexbox）被设计为一个一维布局模型，并作为一种可以在界面中分配项目空间和提供强大对齐能力的方法。 而 Sass basically 是一个工具，它允许用户避免 CSS 的一些缺点，它是一种被解释为 CSS 的脚本语言。 Flexbox 和 Sass 都受最新版本的 Bootstrap（即 Bootstrap 4）支持。 23) Bootstrap 4 中 Sass 的完整形式是什么？
答案：b. Syntactically awesome Stylesheets 解释：Sass 是 Syntactically awesome Stylesheets 的缩写。它是一种样式表语言，最初由 Hampton Catlin 设计，并由 Natalie Weizenbaum 开发。它可以用作一种可以轻松解释 CSS 的脚本语言。 24) 以下哪个类用于为表格行添加条纹样式？
答案：b. .table-striped 解释：用户必须使用 .table-striped 来为 <tbody> 中的任何表格行添加斑马条纹。添加条纹可以增强表格的外观。 条纹表的语法如下所示 <table class="table table-striped">
<thead>
<tr>
<th>Name of the user</th>
<th>Roll Number</th>
<th>Phone Number</th>
</tr>
</thead>
<tbody>
<tr>
<td>James</td>
<td>01</td>
<td>12345</td>
</tr>
<tr>
<td>May</td>
<td>02</td>
<td>12346</td>
</tr>
</tbody>
</table>
25) 以下哪个上下文类用于为面板着色？
答案： d. 以上所有 解释：Bootstrap 4 提供了一个面板，该面板可以有一个带边框的框，并在其内容周围添加一些内边距。要为面板着色，用户必须使用以下上下文类：
26) 关于 Bootstrap 的移动优先策略，以下哪个是正确的？
答案： d. 以上所有 解释：Bootstrap 自 Bootstrap 3 起已转向移动优先。移动优先意味着“移动优先”样式可以在整个库中找到，而不是分散在单独的文件中。用户只需将视口 meta 标签添加到 <head> 元素中，即可确保在移动设备上正确渲染和触摸缩放。 <meta name = "viewport" content = "width = device-width, initial-scale = 1.0"> 在这里，用户必须将视口 meta 标签插入到元素中，以确保在移动设备上启用正确的渲染和触摸缩放。 width 属性可用于控制设备宽度。如果它与设备宽度保持一致，将确保它在不同设备（如手机、桌面、平板电脑等）上都能正确渲染。 在此，initial-scale = 1.0 帮助用户理解，当加载时，网页将以 1:1 的比例渲染，并且开箱即用不会应用任何缩放。 因此，此处的选项都是正确的。 27) 以下哪个 Bootstrap 按钮样式可用于使按钮尺寸变小？
答案：c. .btn-sm 解释：要创建一个尺寸较小的按钮，用户必须添加 .btn-sm。其语法如下所示 <button type="button" class="btn btn-primary btn-sm">Small button</button><button type="button" class="btn btn-secondary btn-sm">Small button</button> 28) 以下哪个 Bootstrap 样式可使一组按钮垂直堆叠而不是水平放置？
答案：d. .btn-group-vertical 解释：在 Bootstrap 4 中，.btn-group-vertical 类负责使一组按钮垂直堆叠而不是水平放置。 29) 以下哪个 Bootstrap 样式可用于创建动画进度条？
答案：c. .progress-striped 解释：要创建 Bootstrap 中的动画进度条，用户必须插入一个具有 .progress 和 .progress-striped 类的 <div>。同时为 .progress-striped 添加 .active 类。接下来，在上面的 <div> 中，添加一个具有 .progress-bar 类的空 <div>。因此，正确选项是 (b) .active 类。 30) 关于 Bootstrap 媒体对象，以下哪个是正确的？
答案：c. a 和 b 都正确。 解释：Bootstrap 媒体对象在 Bootstrap 4 中非常重要。媒体对象可以定义为可用于创建不同类型组件（如博客评论、推文等）的对象样式。然而，媒体对象的主要目标是缩短代码。 31) 关于 Tooltip 插件的 data-html 数据属性，以下哪个是正确的？
答案：b. 它可以在工具提示中添加 HTML。如果为 false，则将使用 jQuery 的 text 方法将内容插入到 DOM 中。 解释：在 data-html 中，HTML 可以添加到工具提示中。但是，如果为 false，则将使用 jQuery 的 text 方法将内容插入到 DOM 中。因此，正确选项是 (b)。 32) 关于 Tooltip 插件的 data-delay 数据属性，以下哪个是正确的？
答案：d. 延迟显示和隐藏工具提示（以毫秒为单位）。 解释：对于 data-delay，它基本上会延迟工具提示的显示和隐藏（以毫秒为单位），但它不适用于手动触发类型。如果提供一个数字，则延迟应用于隐藏或显示。 33) 以下哪个 Bootstrap 样式用于创建垂直胶囊导航？
答案：c. .nav, .nav-pills, .nav-stacked 解释：用户可以使用 .nav-stacked 类以及 .nav, .nav-pills 类轻松地将胶囊垂直堆叠。因此，正确选项将是 (c)。 34) 以下哪个 Bootstrap 样式用于向 .navbar 添加文本？
答案：a. .navbar-text 解释：在 Bootstrap 中，.navbar-text 类可用于向 .navbar 插入文本。因此，正确选项将是 (a)。 35) Bootstrap 表单的默认布局是什么？
答案：a. .vertical (垂直) 解释：Bootstrap 表单的基本布局默认是垂直的。但是，用户可以通过使用 .inline 类和 .horizontal 类等不同类来更改布局并将其转换为内联或水平布局。因此，正确选项将是 (a) .vertical。 36) 关于 Bootstrap 网格系统，以下哪个是正确的？
答案： d. 以上所有 解释：在 Bootstrap 中，提供了如 .row 和 .col-xs-4 等预定义的网格类，用于创建网格布局。此外，列可以创建间隙，即列内容之间的空隙。网格列还用于指定用户希望跨越的十二列的可用列数。因此，正确选项将是 (d) 以上所有选项。 37) 关于 Bootstrap 帮助文本，以下哪个是真实的？
答案：c. a 和 b 都正确。 解释：在 Bootstrap 中，表单控件可以具有与输入项一起流动的块级帮助文本。此外，它还可以通过在 <input> 之后使用 .help-block 来添加一个全宽的块级内容。因此，正确选项将是 (c)，即两个给定的选项都正确。 38) 关于 Tab 插件，以下哪个是正确的？
答案：c. a 和 b 都正确 解释：当用户使用 Tab 插件时，他/她可以通过数据属性切换其中的隐藏内容。此外，用户也可以通过 JavaScript 切换隐藏内容。因此，正确选项是 (c)。 39) 关于 Bootstrap，以下哪个是正确的？
答案： d. 以上所有 解释：Bootstrap 是一个强大的前端框架，用于创建现代网站和 Web 应用程序。它是开源且免费使用的。Bootstrap 还支持 JavaScript 扩展。Bootstrap 也是响应式 CSS，可适应桌面、平板电脑和手机。 此外，它为开发者提供了构建界面的干净、统一的解决方案。 它还包含易于定制的功能齐全的内置组件。 40) 关于 Bootstrap Well (井)，以下哪个是正确的？
答案：c. a 和 b 都正确。 解释：在 Bootstrap 中，Well 可以定义为类似于 Bootstrap 面板，它具有一些圆角边框和周围的内边距。创建 Well 的主要目的是吸引对网站某些内容的关注。.well 类可用于创建基本的 Well。.well 类在元素周围插入圆角边框，并带有灰色背景颜色和一些内边距。但是，这可以通过 CSS 的文本颜色和内边距来更改。 简单来说，Well 是一个 <div> 中的容器，它使内容在页面上呈现出凹陷的效果。 要创建一个 Well，只需将用户希望显示在 Well 中的内容包装在一个包含 .well 类的 <div> 中即可。 下一主题Bootstrap 4 |
我们请求您订阅我们的新闻通讯以获取最新更新。
我们提供所有技术（如 Java 教程、Android、Java 框架）的教程和面试问题
G-13, 2nd Floor, Sec-3, Noida, UP, 201301, India
Python
Java
JavaScript
SQL
C
C++
HTML
CSS
React
Node.js
Spring Boot
C#
PHP
MySQL
MongoDB
AI
ML
DSA
DBMS
OS
Aptitude
Reasoning