Anonim

如果您从未听说过Twitter开发的Bootstrap框架,该框架用于制作漂亮的网站,那么您就错过了! Bootstrap使您无需使用CSS(级联样式表)就可以轻松快速地设计网站。 如果您不熟悉Web编程,则无需了解CSS即可开始学习Bootstrap的工作方式。 您只需要一个HTML文档。 我们将看一下Bootstrap,向您展示它的全部含义,工作原理,以及它是否对您构建的每个网站都是不错的选择。

将Bootstrap API插入HTML文件

您可以使用几种方法将Bootstrap插入主项目文件中。 第一种选择是将所有必要的Bootstrap文件插入项目中。 您可以通过下载软件包并将其上传到您的项目文件夹中来实现。 当然,您必须将主Bootstrap CSS文件链接到您的文档。 Bootstrap的官方网站提供了有关如何执行此操作的分步指南。

另一个选项是跳过下载程序包并使用内容分发网络(CDN)。 CDN使您无需下载主Bootstrap文件即可将其链接到HTML文档。 当然,对于专业网站而言,这并不总是一件好事,因为如果该服务器出现故障,我不会太快地离开我的业务或投资组合页面来决定命运。 最好在项目中包含文件,但是出于学习的目的,CDN可以正常工作。

要将Bootstrap插入HTML文档,只需将以下代码放入 HTML文档中的标签:

将这些链接插入该head标签后,就应该准备好开始使用Bootstrap类。 您的文档应如下所示:

引导程序和类

Bootstrap元素分为多个类,它们只是一堆可以插入标记中的预编写CSS。 将类插入标记很容易,您只需要知道要使用的类的名称,然后使用class =“ classname”值将其应用到您的HTML元素中即可,如前一篇文章所述。

困难的部分是弄清楚所有这些如何共同创造出美丽的东西。 您可以直接从官方文档中查看Bootstrap中可用的所有不同类。 现在,掌握Bootstrap是另一个故事了。 那不是我们或其他任何人可以教您的。 您可以逐节观看本教程,但是要熟练使用该框架,需要进行很多次反复试验。 而且,这需要您在自己的项目中进行实际操作。

考虑到这一点,我恳请您使用Atom或其他文本编辑器在计算机上启动您自己的HTML项目,查看HTML和CSS类的全部内容,然后开始使用Bootstrap。 如果您了解足够的标记,甚至可以创建自己的投资组合网站作为测试练习。

Bootstrap是否是每个网站的可行选择?

Bootstrap是一个很好的框架,但是它对您创建的每个网站都是可行的选择吗? 它确实取决于开发人员以及项目的要求。 在许多专业环境中,您实际上不会选择要使用的技术,因为这在很大程度上取决于项目经理。 如果说项目经理选择使用Bootstrap,那么您还将把它与大量自定义CSS结合在一起。 这就是通常使您的网站与使用Bootstrap的其他网站不同的独特之处。

我个人并不认为Bootstrap是 每个 网站的理想选择。 当然,它可以提供帮助并提供一些捷径,但是我最终发现,从头开始进行CSS设计是最好的方法,很大程度上是因为您可以控制CSS。 但是再一次,如果您只是刚开始进行Web编程,那么完全使用Bootstrap并不是一件坏事,但是在您的职业生涯中请不要依赖它。

值得注意的是,如果您是新手开发人员,则不应将Bootstrap用于投资组合中的所有项目。 可能会发现您可能精通API,但是您并不完全了解CSS。 就是说,在您的投资组合中同时包含这两者是不错的选择(或者甚至是CSS,因为很容易使用Bootstrap)是很好的。

闭幕

简而言之,这就是Bootstrap的全部内容。 如前所述,我鼓励您启动自己的HTML项目,并向元素中添加一些不同的类,以开始使用该框架。 您可以在此处找到Bootstrap提供的所有不同组件以及说明和代码示例。

Bootstrap确实是一种整洁的工具,但请记住不要独自依赖它! 熟悉它并了解您在框架中的工作方式非常好,但同时也请确保您沉浸于CSS中以真正了解幕后情况。 不仅如此,而且CSS方面的扎实知识也给Bootstrap带来了很多帮助,使您可以通过自己的自定义真正创建一些独特而精美的网站。

如何使用引导程序制作漂亮的网站