求解ASP.NET项目使用Bootstrap后textbox的宽度指定失效了

Question

bootstraptextbox

Answer 1

你确定你的css全部引用进去了吗？
用IE 的F12检查下textbox引用的哪个css是不是被覆盖了还是

Answer 2

<div class="jumbotron">  <!-- 可能是这个地方的样式引起的，div的宽度-->
        <h1>ASP.NET</h1>
        <p class="lead">ASP.NET is a free web framework for building great Web sites and Web applications using HTML, CSS and JavaScript.</p>
        <p><a href="http://www.asp.net" class="btn btn-primary btn-lg">Learn more &raquo;</a></p>
        <asp:TextBox ID="TextBox1" runat="server" cssclass="form-control"></asp:TextBox>
        <asp:TextBox ID="TextBox2" runat="server" width="100%"></asp:TextBox>
    </div>

Answer 3

<span style="color: #993300;"> <div class="jumbotron" >  </span><!-- 可能是这个地方的样式引起的，div的宽度-->
        <h1>ASP.NET</h1>
        <p class="lead">ASP.NET is a free web framework for building great Web sites and Web applications using HTML, CSS and JavaScript.</p>
        <p><a href="http://www.asp.net" class="btn btn-primary btn-lg">Learn more &raquo;</a></p>
        <asp:TextBox ID="TextBox1" runat="server" cssclass="form-control"></asp:TextBox>
        <asp:TextBox ID="TextBox2" runat="server" width="100%"></asp:TextBox>
    </div>

Answer 4

首先用浏览器查看元素，看是否查找到form-control样式，否则就是div样式影响到了Bootstrap组件样式。

Answer 5

自己找到原因了。VS2013自动生成的代码，其中site.css包含了这段：/* Set widths on the form inputs since otherwise they're 100% wide */
input[type="text"],
input[type="password"],
input[type="email"] {
    max-width: 280px;
}
不得不说，csdn现在落后了。