Bootstrap面试题及答案 - [ 前端技术 ]

Bootstrap面试题及答案

Bootstrap是一个免费的开放源代码的前端Web框架。 它包含用于版式,表单,按钮,导航和界面的其他组件的模板,以及基于HTML和CSS的可选JavaScript扩展。

1. Bootstrap是什么?

Bootstrap是一个基于前端框架的Web开发平台,可创建出色的响应式设计。 它快速,简便,并且具有使用HTML和CSS设计的多个模板。 这些模板用于表单,表格,按钮,版式,模型,表格,导航,轮播和图像。 Bootstrap还具有Javascript插件,这些插件是可选的。Bootstrap是开发移动Web应用程序的首选。详细答案>>

2. 为什么您更喜欢Bootstrap进行网站开发?

Bootstrap具有比其他Web开发平台更好的功能。 它为几乎所有已知的浏览器(例如Opera,Chrome,Firefox,Safari等)提供了广泛的浏览器支持。有了CSS和HTML的足够知识,Bootstrap上的Web开发就变得容易了。 此外,它在响应式设计的帮助下支持移动应用程序。 它可以根据设备,屏幕大小等来调整CSS。它不会创建多个文件,而是仅创建一个文件,从而减少了开发人员的工作量。详细答案>>

3. Bootstrap的关键组件是什么?

Bootstrap总共有五个关键组件,即CSS(多个CSS文件),脚手架(基本系统的必需组件,包括网格系统,背景和链接样式),布局组件:(共享所有布局的列表),JavaScript 插件(包括jQuery和JavaScript插件)和自定义(允许为所需框架自定义所有组件)。详细答案>>

4. Bootstrap提供多少种布局?

Bootstrap有两种主要布局,即流体布局和固定布局。 流畅的布局对于创建宽度100%并覆盖所有屏幕宽度的应用程序是必需的。 固定版式仅用于标准屏幕(940px)。 两种布局均可用于创建响应式设计。详细答案>>

5. 为什么在Bootstrap中使用Jumbotron?

Jumbotron在引导程序中具有非常基本的功能,即突出显示内容。 它既可以是标语,也可以是标题。 它增加了标题的大小,并为着陆页的内容提供了一个空白。 为了在Bootstrap中实现Jumbotron,请使用: 用.jumbotron类创建一个容器<div>例如:如果希望Jumbotron不会到达屏幕边缘,请使用<div class="container">。 Jumbotron可以具有任何有效的HTML以及其他函数和类。详细答案>>

6. 在Bootstrap中用于代码显示的两个代码标签是?

有两种在Bootstrap中显示代码的简单方法: <code>标记:如果希望显示内嵌代码,只需添加<code>标记;<pre>标签:如果代码中包含多行甚至是一个块元素,则可以使用<pre>标签来显示;详细答案>>

7. Bootstrap折叠元素是什么?

Bootstrap折叠元素是一种可以折叠任何特定元素而无需开发任何JavaScript代码甚至手风琴标记的方法。 现在,为了实现此元素,需要在controller元素中添加data-toggle=”collapse”。 要自动分配可折叠元素的控件,可以将data-target或href以及data-toggle=”collapse”一起使用。 还提供其他选项,例如:.collapse (options), .collapse ('hide'), .collapse ('show&...详细答案>>

8. 为什么使用Bootstrap Carousel插件?

Carousel插件负责在网站上添加滑块。当网站空间有限但内容庞大时,开发人员通常会使用它。 一些常见的轮播包括: .carousel (options).carousel ('pause').carousel ('prev').carousel ('next').carousel ('number').carousel ('cycle')详细答案>>

9. Bootstrap中媒体对象的作用是什么?有多少种可用的类型?

在Bootstrap中,可以使用媒体对象添加图像,音频和视频。 可以将其放置在内容的左侧或右侧。 如果开发人员希望创建媒体元素,则可以使用.media类,其中将源指定为.media-object类。 通常有两种媒体对象,即.media和.media-list。详细答案>>

10. pagination在Bootstrap中的作用是什么,它们的分类是什么?

当必须由Bootstrap处理无序列表时,它将使用分页。 要处理该列表,可以使用不同的类,例如.pagination,.disabled,.active,.pagination-lg,.pagination类可对网页进行分页。 .disabled类用于使链接不可点击。.active类用于指示当前网页。.pagination-lg和.pagination-sm可用于获取不同大小的项目。详细答案>>

11. Bootstrap和Foundation有什么区别?

Bootstrap支持LESS预处理器,并允许针对移动设备和台式机进行设计和开发。 它仅使用像素,并具有许多UI元素。 另一方面,Foundation支持Sass预处理程序,并允许大多数移动设计。 它使用REM,并且在UI元素方面只有很少的选择。详细答案>>

12. 创建基本或垂直表单的步骤是什么?

创建垂直或基本步骤可以遵循几个步骤: 首先,可以将角色表单添加到父<form>元素。其次,通过在<div>中包装标签和控件并使用类.form-group来添加适当的间距。最后,将类.form-control应用于不同的元素,例如<input>,<textarea>和<select>等等。详细答案>>

13. Bootstrap中的well是什么?

Bootstrap well是一个使内容显得凹陷的容器。 有时,它也可能在网页上产生插图效果。 因此,开发人员可以在<div>和.well的帮助下创建一个容器,并将内容包装在容器中。 内容将按照意愿显示。详细答案>>

14. 在Bootstrap中创建Nav元素的过程是什么?

Bootstrap中有几种样式导航元素,每种样式都使用相同的功能,即.nav类。 为了创建选项卡或表格导航,可以使用.nav类以简单或基本的无序列表开始。 要添加标签,可以使用功能.nav-tabs。详细答案>>

15. Bootstrap中的列表组是什么,它在哪里找到其应用程序?

当需要显示简单元素以及复杂元素以及自定义内容时,可以使用列表组。 可以使用.list-group类创建一个简单的列表,以帮助解决整个列表,而使用.list-group-item类仅引用该列表中的单个项目。详细答案>>

16. Bootstrap中使用的Modal插件是什么?

当需要覆盖父窗口时,可以使用模式创建子窗口。 开发人员通常使用自定义的Jquery插件在Bootstrap上创建模态(Modal)。 当要改善用户体验并添加更多功能时,模态窗口是最好的。 模态窗口可以借助模态插件简单地创建。详细答案>>

17. Bootstrap容器(container)是什么?

Bootstrap容器(container)是一个类,用于在网页中心创建一个用于放置内容的区域。 有行元素充当列的容器,从而构成了网格系统。 行用于创建水平列组。 使用.container函数,可以获得响应式设计,其中将包括所有其他HTML代码。详细答案>>

18. Bootstrap中的列顺序是什么?

列排序是Bootstrap中最有趣的功能之一。 通过使用适当的功能,可以轻松地并按定义的顺序编写列。也可以在另一列中显示它们。为了轻松更改或更改列的顺序,可以使用类.col-md-push-*和.col-md-pull-*。详细答案>>

19. 包装页面内容最合适的功能是什么?

为了包装页面的内容,可以使用类.container。 使用类.container,文本可以居中。

详细答案>>
注: 此试题仅作为相关知识水平测试,不能作为权威试题和答案。非商业转载注明原文链接即可;商业转载需本站授权同意。