使用 Bootstrap 创建网站

这是我们第一个使用 Bootstrap 的网站

在这篇文章中,我们将从使用 Bootstrap 创建一个站点开始, 开源框架,使我们可以轻松地使其响应并为其提供一些交互性。 它是由我们之前推荐的开发环境插件自动生成的基本模板,我们将不得不对其进行修改。

以前的文章 您将找到安装 VS Codium、将其用户界面翻译成西班牙语并安装 Bootstrap 插件的说明。

要记住两件事:

  1. 我们使用的命令是键盘快捷键,您必须输入它们。 复制/粘贴不起作用。
  2. 我们的内容管理器不允许我显示 HTML 代码,所以我必须使用屏幕截图。 这样您就可以访问我上传的示例代码 到 GitHub。

如何克隆 GitHub 存储库

伟人与我们其他人的区别在于他们对问题的反应方式。 Richard Stallman 不喜欢他的打印机驱动程序,因为他们不让他改变它,他开始了自由软件运动。 Linus Torvalds 不相信任何代码共享平台并创建了自己的平台。 混帐。

与只允许用户交互是下载的传统软件分发系统不同, 使用 Git,您可以随着时间的推移跟踪项目的演变。 其他人可以克隆存储库,进行修改,并建议原始项目的开发人员合并它们。 如果被接受,开发人员可以轻松地做到这一点,而无需下载和重新上传文件。

有几个基于Git的服务,我选择了GitHub 仅仅因为它与 VS Codium 集成。

为了将示例文件下载到您的计算机,您只需要按照您的发行版在终端中安装包的说明安装 git 包。

然后键入以下命令。

我更喜欢将文件保存在 Documents 文件夹中,因此我更改了目录

cd Documentos

然后我克隆文件:

git clone https://github.com/dggonzalez1971/bootstrap.git

我将在其余每篇文章中提醒您这些步骤,因为这样您将在上传示例文件时对其进行更新。

要查看文件,只需打开文件资源管理器并查找文件夹 引导程序。

使用 Bootstrap 创建网站

如果您更喜欢手动输入代码,我们首先创建一个文件夹,我们将在其中保存站点。 你可以放任何你喜欢的名字。

然后我们按照以下步骤操作:

  1. 我们去菜单 档案。
  2. 点击 新文本文件.
  3. 点击 保存。
  4. 我们寻找我们创建的文件夹并输入文件名 示例 1.html。
  5. 点击 保存。

有时文件资源管理器窗口可能会被 VSCodium 隐藏。

让我们让扩展程序为我们创建基本模板。 为此,我们键入 !b5-$

这将生成您将在示例文件夹中找到的代码 example1.html

我们将看到以下内容:

基本引导模板

这是 Bootstrap 扩展生成的代码。

我们将对这个文件进行一些更改。 您将在名称 example2.html 下找到修改

  • 在第 2 行,我们通过将 eng 替换为 es 来更改语言。 这向搜索引擎表明该站点的语言是西班牙语。
  • 在第 6 行中,我们更改了标签下的文本 标题。 我们把 我的第一个 Bootstrap 网站。
  • 在第 12 行,我们更改标签之间的内容 h1 这是一个使用 Bootstrap 制作的网站。

接下来,我们将进行一些重要的修改。 这些修改与:

  1. 插件开发人员无法跟上 Bootstrap 版本,并且有更多最新版本。
  2. 引导组件有很多选项,我对另一个感兴趣。
  3. 根据官方文档,对 Javascript 库的调用必须在 body 标记内。

比如2我们修改了第7行的内容,删除了第8行和第9行并上传了剩余的内容,以保持编号的兼容性。 然后我们单击第 10 行的末尾以创建一个新的第 11 行并放置指向 Javascript 库的链接。

如果您不理解代码,请不要担心。 我将在下一篇文章中解释每一行的功能。


发表您的评论

您的电子邮件地址将不会被发表。 必填字段标有 *

*

*

  1. 负责资料:AB Internet Networks 2008 SL
  2. 数据用途:控制垃圾邮件,注释管理。
  3. 合法性:您的同意
  4. 数据通讯:除非有法律义务,否则不会将数据传达给第三方。
  5. 数据存储:Occentus Networks(EU)托管的数据库
  6. 权利:您可以随时限制,恢复和删除您的信息。