Bootstrap 框架对 asp.net webform 没有响应 [英] Bootstrap framework not responsive for asp.net webform
问题描述
我想将 bootstrap v2.3.2 用于我的基于 ASP.NET 网络表单的网站.我正在关注本教程 ，否则响应组件放在单独的文件bootstrap-responsive.css
要覆盖容器的宽度，您需要将其添加到 CSS 中:
@media(最小宽度:1200px){.容器，.navbar-static-top .container,.navbar-fixed-top .container,.navbar-fixed-bottom .container {宽度:1000px；}}I want to use bootstrap v2.3.2 for my asp.net webform based website. I am following this tutorial link . So far it looks fine but the web page is not resizing when i re-size the browser window. It just remain the same size as if it is not Responsive page.
This is my following code of ASP.Net MasterPage.aspx & Default.aspx page
MasterPage.aspx
<head runat="server">
<title></title>
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<link href="../styles/bootstrap.css" rel="stylesheet" type="text/css" />
<link href="../styles/english_css.css" rel="stylesheet" type="text/css" />
<asp:ContentPlaceHolder id="head" runat="server"></asp:ContentPlaceHolder>
</head>
<body>
<form id="form1" runat="server">
<!-- Master Page -->
<div>
<!-- Container -->
<div class="container">
<!-- Header -->
<div class="row-fluid">
<div class="span12">
<div class="header-row1">
</div>
</div>
</div>
<!-- Header -->
<div class="row-fluid">
<div class="span12">
<!-- Content -->
<asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
</asp:ContentPlaceHolder>
<!-- Content -->
</div>
</div>
<!-- Footer -->
<div class="row-fluid"><div class="span12"><h1>Footer Section</h1></div></div>
<!-- Footer -->
</div>
<!-- Container -->
</div>
<!-- Master Page -->
</form>
<script type="text/javascript" src='<%# ResolveUrl ("~/script/jquery-1.10.2.min.js") %>'></script>
<script type="text/javascript" src='<%# ResolveUrl ("~/script/bootstrap.min.js") %>'></script>
</body>
</html>
Default.aspx
<%@ Page Title="" Language="C#" MasterPageFile="~/en/SiteMasterPage.master" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="Default" %>
<asp:Content ID="Content1" ContentPlaceHolderID="head" Runat="Server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="ContentPlaceHolder1" Runat="Server">
<div class="row-fluid"><div class="span12"><h1>Content Area</h1></div></div>
</asp:Content>
I am actually looking for a asp.net web-form template like one as show in image.
I am just a beginner for bootstrap & hopeful of learning it. I would appreciate if some can help me out in why this is not working.
In example they are just using bootstrap.css for the example & it seem sto work for them. For me it works when i use bootstrap-responsive.css but adds width of 1200px while i want 1000px.
What is different between thos css files.
Help in this regard is appreciated.
UPDATE: I had to add both version of bootstrap.css in case i am using v2 otherwise i can use only `bootstrap. Problem now i have is that i want to have width of main container at 1000px. How can i change it
Bootstrap 2 offers two options, you can download all CSS compiled in a single file from the customize section, otherwise the responsive components are placed in the separate file bootstrap-responsive.css
To override the container's width you need to add this to your CSS:
@media (min-width: 1200px){
.container,
.navbar-static-top .container,
.navbar-fixed-top .container,
.navbar-fixed-bottom .container {
width: 1000px;
}
}
这篇关于Bootstrap 框架对 asp.net webform 没有响应的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
