0
您好我最近在Bootply.com上創建了幾頁，並試圖將它們轉移到我在Visual Studios中創建的網站，但是，風格最終變得格格不入，看起來不像它在Bootply.com上的樣子。下面是一些圖片：風格在網站上顯示不同於在Bootply上
在Bootply：
在視覺工作室：
我用引導2.3.2開發它Bootply和我下載的自舉從這個網站：http://getbootstrap.com/2.3.2/，這是2.3.2版本，所以我不明白爲什麼應該有任何區別，如果我只是複製並粘貼到Bootply上創建的標籤上視覺工作室。這種差異並不是由於所用圖像的不同造成的，因爲在Bootply上，無論使用什麼圖像，它都會縮放以填充旋轉木馬，並且菜單出現在圖像內部而不是頂部。
這裏是我的頁面的HTML，也許我說的東西的投擲引導關：
<%@ Page Language="C#" AutoEventWireup="true" CodeFile="HomeTest.aspx.cs" Inherits="HomeTest" %>
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head runat="server">
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1">
<!-- The above 3 meta tags *must* come first in the head; any other head content must come *after* these tags -->
<title>Home</title>
<!-- Bootstrap -->
<link href="Styles/css/bootstrap.min.css" rel="stylesheet">
\t <link href="Styles/css/home.css" rel="stylesheet" />
\t <script src="http://ajax.googleapis.com/ajax/libs/jquery/1.10.2/jquery.min.js"></script>
\t <script src="Styles/js/bootstrap.min.js"></script>
<!-- HTML5 shim and Respond.js for IE8 support of HTML5 elements and media queries -->
<!-- WARNING: Respond.js doesn't work if you view the page via file:// -->
<!--[if lt IE 9]>
<script src="https://oss.maxcdn.com/html5shiv/3.7.2/html5shiv.min.js"></script>
<script src="https://oss.maxcdn.com/respond/1.4.2/respond.min.js"></script>
<![endif]-->
</head>
<body>
<!-- NAVBAR
=================== -->
<div class="navbar-wrapper">
<!-- Wrap the .navbar in .container to center it within the absolutely positioned parent. -->
<div class="container">
<div class="navbar navbar-inverse">
<div class="navbar-inner">
<!-- Responsive Navbar Part 1: Button for triggering responsive navbar (not covered in tutorial). Include responsive CSS to utilize. -->
<button type="button" class="btn btn-navbar" data-toggle="collapse" data-target=".nav-collapse">
<span class="icon-bar"></span>
<span class="icon-bar"></span>
<span class="icon-bar"></span>
</button>
<a class="brand" href="#">Brand</a>
<!-- Responsive Navbar Part 2: Place all navbar contents you want collapsed withing .navbar-collapse.collapse. -->
<div class="nav-collapse collapse">
<ul class="nav">
<li class="active"><a href="#">Home</a></li>
<li><a href="#about">Log In</a></li>
<li><a href="#contact">About</a></li>
<!-- Read about Bootstrap dropdowns at http://twitter.github.com/bootstrap/javascript.html#dropdowns -->
<li class="dropdown">
<a href="#" class="dropdown-toggle" data-toggle="dropdown">Dropdown <b class="caret"></b></a>
<ul class="dropdown-menu">
<li><a href="#">Action</a></li>
<li><a href="#">Another action</a></li>
<li><a href="#">Something else here</a></li>
<li class="divider"></li>
<li class="nav-header">Nav header</li>
<li><a href="#">Separated link</a></li>
<li><a href="#">One more separated link</a></li>
</ul>
</li>
</ul>
</div><!--/.nav-collapse -->
</div><!-- /.navbar-inner -->
</div><!-- /.navbar -->
</div> <!-- /.container -->
</div><!-- /.navbar-wrapper -->
<!-- Carousel
================================================== -->
<div id="myCarousel" class="carousel slide" data-ride="carousel">
<div class="carousel-indicators">
<ol>
<li data-target="#myCarousel" data-slide-to="0" class="active"></li>
<li data-target="#myCarousel" data-slide-to="1"></li>
<li data-target="#myCarousel" data-slide-to="2"></li>
</ol>
</div>
<div class="carousel-inner">
<div class="item active">
<img src="http://lorempixel.com/1280/1024/technics">
<div class="container center center-vertical">
<div class="carousel-caption center center-text">
<h1 style="font-size:60px">Welcome!</h1>
<p class="lead" style="font-size:32px">Once upon a time there was....</p>
<a class="btn btn-large btn-primary center-block" href="#">Sign up today</a>
<a class="btn btn-large" style="background-color:transparent">Donate!</a>
</div>
</div>
</div>
<div class="item">
<img src="http://lorempixel.com/1280/1024/technics" alt="">
<div class="container">
<div class="carousel-caption">
<h1>Another example headline.</h1>
<p class="lead">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<a class="btn btn-large btn-primary" href="#">Learn more</a>
<a class="btn btn-large" style="background-color:transparent">Donate!</a>
</div>
</div>
</div>
<div class="item">
<img src="http://lorempixel.com/1280/1024/abstract" alt="">
<div class="container">
<div class="carousel-caption">
<h1>One more for good measure.</h1>
<p class="lead">Cras justo odio, dapibus ac facilisis in, egestas eget quam. Donec id elit non mi porta gravida at eget metus. Nullam id dolor id nibh ultricies vehicula ut id elit.</p>
<a class="btn btn-large btn-primary" href="#">Browse gallery</a>
<a class="btn btn-large" style="background-color:transparent">Donate!</a>
</div>
</div>
</div>
</div>
<a class="left carousel-control" href="#myCarousel" data-slide="prev">‹</a>
<a class="right carousel-control" href="#myCarousel" data-slide="next">›</a>
</div><!-- /.carousel -->
</body>
該網站在部署後或僅在Visual Studio中顯示格式不正確？ –
我在本地主機上運行它。上面的圖片是該網站在我的瀏覽器中使用本地主機的外觀。 – Xigaphactus
@LawrenceCherone是的，我正在使用bootstrap.min.css – Xigaphactus