将HTML页面连接到Bootstrap（jumbotron）

Question

I've been trying to make a simple static web page with some Bootstrap functionality in it. 我一直在尝试制作一个包含一些Bootstrap功能的简单静态网页。 I set up a LAMP server on an AWS ec2 instance to accomplish this. 我在AWS ec2实例上设置了LAMP服务器来完成此任务。

To try some things out, I just wanted to use a jumbotron to make sure I was able to connect the bootstap library to my html page. 为了尝试一些事情，我只是想使用一个巨型机器人来确保我能够将引导程序库连接到我的html页面。 I accomplished this at some point, but I stopped working on this and came back a few weeks later to continue. 我在某个时候完成了这项工作，但是我停止了这项工作，几周后又回来继续。 I picked up where I left off, with the same exact code, but this time, the jumbotron I had working was no longer present. 我使用完全相同的代码从上次中断的地方接起电话，但是这次不再使用我曾经工作过的巨型飞机了。 Basically, the html page I made was a typical html page with normal fonts and no jumbotron effect. 基本上，我制作的html页面是典型的html页面，具有正常的字体并且没有巨型效果。 My code is below: 我的代码如下：

<!DOCTYPE html>

<html lang="en">

<head>
<title>Test</title>

<meta charset="utf-8">
<!--meta tag viewport purpose is to scale screen correctly-->
<meta name="viewport" content="width=device-width, initial-scale=1.0">

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


</head>

<body>

<div class = "jumbotron">
    <div class = "container"> 
      <h1>Welcome to landing page!</h1>
     <p>This is an example for jumbotron.</p>
  </div>
</div>


</body>



</html>

I mentioned this is being done in an AWS ec2 instance. 我提到这是在AWS ec2实例中完成的。 So assume that the path to my html file is /var/www/html. 因此，假设我的html文件的路径为/ var / www / html。 the html directory holds my .html file which is my static web page, and also holds the js,fonts,and css directories downloaded from bootstrap. html目录包含我的.html文件（这是我的静态网页），还包含从引导程序下载的js，fonts和css目录。 So... once again, html directory contents are: 所以...再次，html目录内容是：

css custom.css fonts js Will.html css custom.css字体js Will.html

I'm confused as to how I left the code alone and after coming back a couple of weeks later, the jumbotron was no longer working. 我对如何单独保留代码感到困惑，几周后又回来了，巨型自动机不再工作了。 Initially there was a master bootstrap directory that held the css, fonts, and js directories, but I just got rid of that master directory and put the three directories inside on the same level as the html page. 最初有一个主引导目录，其中包含css，fonts和js目录，但是我只是摆脱了该主目录，并将这三个目录放在与html页面相同的级别上。 That shouldn't matter though, I just changed the path to those directories. 但这没关系，我只是更改了这些目录的路径。 I updated my LAMP server on the aws ec2 instance, so maybe thats causing an issue. 我在aws ec2实例上更新了LAMP服务器，所以也许就是这样导致了问题。 Not sure though, any help on how to get this jumbotron working would be great. 但是不确定，如何使这个巨型波宝工作任何帮助都会很棒。

Thanks. 谢谢。

Answer 1

try this 尝试这个

<!DOCTYPE html>

<html lang="en">

<head>
<title>Test</title>

<meta charset="utf-8">
<!--meta tag viewport purpose is to scale screen correctly-->
<meta name="viewport" content="width=device-width, initial-cale=1.0">

<link rel="stylesheet" href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css" >
<link href="custom.css" rel="stylesheet" >


</head>

<body>

<div class = "jumbotron">
    <div class = "container"> 
      <h1>Welcome to landing page!</h1>
     <p>This is an example for jumbotron.</p>
  </div>
</div>


</body>

<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.2/jquery.min.js"></script>
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

</html>

将HTML页面连接到Bootstrap（jumbotron）

问题描述

1 个解决方案

解决方案1
0 2016-05-03 01:19:26

将HTML页面连接到Bootstrap（jumbotron）

问题描述

1 个解决方案

解决方案1 0 2016-05-03 01:19:26

解决方案1
0 2016-05-03 01:19:26