零基础学做网站培训介绍

当前位置:

网站怎么引入本地BOOTSTRAP框架文件

以下为学做网站论坛关于“网站怎么引入本地BOOTSTRAP框架文件”讲解视频教程。

我们做自适应网站时,会使用到BOOTSTRAP框架,使用BOOTSTRAP框架之前需要在自己的网站中引入BOOTSTRAP。

手机网站制作课程中,我们建议大家先下载BOOTSTRAP,然后引入本地环境下的BOOTSTRAP框架。但由于BOOTSTRAP中文文档网站改版,去除了引入本地环境下的BOOTSTRAP的代码,所以下面将网站引入本地BOOTSTRAP框架文件的代码贴出来。

方法/步骤

第一步:下载BOOTSTRAP框架文件,并将它里面的三个文件夹全部放在与自己网页同一个文件夹下面;
网站怎么引入本地BOOTSTRAP框架文件

第二步:在</head> 标签上面放上引入CSS的代码。


 <link href="css/bootstrap.min.css" rel="stylesheet">

网站怎么引入本地BOOTSTRAP框架文件

第三步:在</body>标签上面放上JS代码,来引入JS文件。(包括一个BOOTSTRAP框架本身JS和一个jquery文件)


<script src="https://cdn.jsdelivr.net/npm/jquery@1.12.4/dist/jquery.min.js"></script>
<script src="js/bootstrap.min.js"></script>

网站怎么引入本地BOOTSTRAP框架文件

第四步:以<title>标签上面放上meta标签


<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">

网站怎么引入本地BOOTSTRAP框架文件

第五步:在</head> 标签上面放上针对IE9以下的浏览器的代码。


<!--[if lt IE 9]>
      <script src="https://cdn.jsdelivr.net/npm/html5shiv@3.7.3/dist/html5shiv.min.js"></script>
      <script src="https://cdn.jsdelivr.net/npm/respond.js@1.4.2/dest/respond.min.js"></script>
    <![endif]-->

网站怎么引入本地BOOTSTRAP框架文件

这样我们的网站就正确引入了本地BOOTSTRAP框架文件,实现了自适应。

发表评论

邮箱地址不会被公开。 必填项已用*标注

相关教程

  • 网页如何引入JQuery 图文教程 (15272 次浏览)
    JQuery是一个轻量级的JS框架,它是基于JS开发的。我们在做网站时要使用JQuery,需要先引入JQuery。引入的方法与引入外部JS文件方法一样。下面
  • bootstrap框架是一个特别好用的前端框架,我们在自己建网站时,可以使用bootstrap框架与HTML结合,制作出更多大气的自适应前端界面。下面讲一
  • 我们做自适应网站时,会使用到BOOTSTRAP框架,使用BOOTSTRAP框架之前需要在自己的网站中引入BOOTSTRAP。在手机网站制作课程中,我们建议大家先下
  • 有的学员在本地环境下使用WORDPRESS程序搭建好网站后,打开首页正常,但打开其它页面都显示http返回状态码404错误,那么本地环境网站出现404错误该怎
  • APMServ5.2.6本地环境配置软件介绍由于每台电脑的端口使用情况不一样,很多学员在用XAMPP环境配置软件配制本地环境的时候,经常会不成功,出现服务器或
  • 很多朋友安装xampp之后,启用服务器或者数据库失败,发现端口已经被占用。因为每台电脑占用端口的软件不一样,要如何解决这个问题。第一种解决方
  • bootstrap是一个特别好用的网站前端框架,可以让我们制作响应式网站时比较简单。对于响应式网站制作时,响应式导航是比较重要的部分。下面学做网
  • 新手学做网站时使用wordpress程序做网站,它有一个很棒的功能,就是在后台创建导航菜单,在后台我们可以任意的拖动导航栏目。wordpress程序结合Bootst
  • 我们在学习怎么做网站时,往往想在自己的网站上调用别人网站的网页,实现网页中签入网页的情况,那么如何实现这种在网页中调用另一个网页的效果呢?
  • JS框架以及一些开发包和库类有如下几个,Dojo 、Scriptaculous 、Prototype 、yui-ext 、Jquery 、Mochikit、mootools 、moo.fxDojo (JS library
  • 课程目标:学习WPD主题设置面板的使用,给自己的wordpress网站后台添加主题设置选项课后作业,跟着视频,把WPD面板融合到自己的主题中。
  • template/default/common 模板公共文件夹,全局相关|--block_forumtree.htm 树形论坛版块分支js文件|--block_thread.htm 特殊主题的风格模块文
  • 在我们学做网站的过程中,通过图片的后缀名我们很轻松的了解图片是什么格式的,想要替换的时候,很就简单了。但有的同学的电脑里的图片等文件并没
  • 我们都知道在做网站时,加载的文件越少速度就会越快,包括CSS、JS、图片、数据库等等,特别是门户网站建设更是如此。要减少这些文件的载入,特别