爲什麼僅僅引用Bootstrap css和js來使用Bootstrap類是不夠的？

-1

我在一些動態生成的HTML中引用了bootstrap css和js（以及jQuery js），然後將引導類應用於h1元素，但它並沒有改變所述h1文本的外觀。我生成HTML的鍵（這個問題）的一部分，此代碼：爲什麼僅僅引用Bootstrap css和js來使用Bootstrap類是不夠的？

 private string GetBeginningHTML() 
     { 
      StringBuilder builder = new StringBuilder(); 
      builder.Append("<html>"); 
      builder.Append("<head>"); 
      builder.Append("<title>"); 
      string availableRpts = string.Format("Available Reports For {0}", _unit); 
      builder.Append(availableRpts); 
      builder.Append("</title>"); 
      builder.Append("</head>"); 
      builder.Append("<body>"); 

      builder.AppendFormat("<link href='{0}' rel='stylesheet' />",  
System.Web.Hosting.HostingEnvironment.MapPath(
"~/Content/bootstrap.min.css")); 
      builder.AppendFormat("<script src='{0}'></script>",   
System.Web.Hosting.HostingEnvironment.MapPath(
"~/Scripts/bootstrap.min.js")); 
      builder.AppendFormat("<script src='{0}'></script>",  
System.Web.Hosting.HostingEnvironment.MapPath(
"~/Scripts/jquery- 
1.10.2.min.js")); 

      // Add Header rows 
      builder.Append("<div class=\"jumbotron\">"); 
      builder.Append(String.Format("<h1>Available Reports for {0} 
</h1>", _unit.ToUpper 

())); 
      builder.Append("</div>"); 

      return builder.ToString(); 
     }

...，並從它，我得到以下HTML返回：

<html> 
<head> 
<title>Available Reports For GRAMPS</title> 
</head> 
<body> 
<link href='C:\Projects\PlatypusWebReports\PlatypusWebReports\Content\bootstrap.min.css' rel='stylesheet' /> 
<script src='C:\Projects\PlatypusWebReports\PlatypusWebReports\Scripts\bootstrap.min.js'></script> 
<script src='C:\Projects\PlatypusWebReports\PlatypusWebReports\Scripts\jquery- 
1.10.2.min.js'></script> 
<div class="jumbotron"> 
<h1>Available Reports for GRAMPS</h1> 
</div>

...然後我添加其他的html到它;該頁面呈現良好，但jumbotron類未應用於h1文本 - 「Available Reports for ...」div沒有特殊外觀。

爲什麼bootstrap的jumbotron類沒有被應用？我引用的引導CSS和JavaScript，以及jQuery js文件，所以理論上（ISTM）它應該工作。

我想也許在打開「body」標籤前需要使用css和腳本引用，但將css和腳本引用移動到body標籤上方沒有區別。

來源

2016-04-05 B. Clay Shannon

您不能從磁盤引用資源。您需要使用服務器的URL。 – SLaks

您可以從磁盤引用資源，但不是那樣。您應該使用file：//方法（請注意\需要更改爲/），如下所示：'file：/// C：/ Projects/...'css也應位於head元素內。（請注意，對於file：//工作，這些文件必須位於運行Web瀏覽器的計算機上，因此，如果您的Web服務器和這些文件位於不同的計算機上，則此功能無效） –

您可能想要獲取來自CDN的css和js而不是使用本地文件。請參閱https://www.bootstrapcdn.com/和https://code.jquery.com/ –

你可能想從CDN而不是本地文件中引用的引導和jQuery CSS和JS。

請參閱https://www.bootstrapcdn.com/和https://code.jquery.com/以獲取最新版本的鏈接。

另請注意，CSS應位於磁頭元素內

來源

2016-04-05 16:24:00

使用本Holness'的建議，這是我做了什麼（它的工作原理）：

. . . 
builder.Append("</title>"); 
builder.Append("<link href='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css' rel='stylesheet' />"); 
builder.Append("<script src='https://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js'></script>"); 
builder.Append("<script src=\"https://code.jquery.com/jquery-1.12.2.min.js\" integrity=\"sha256-lZFHibXzMHo3GGeehn1hudTAP3Sc0uKXBXAzHX1sjtk=\" crossorigin=\"anonymous\"></script>"); 
builder.Append("</head>"); 
. . .

來源

2016-04-05 16:22:09

爲什麼僅僅引用Bootstrap css和js來使用Bootstrap類是不夠的？

回答

相關問題