如何在aspx页面中使用Bootstrap?

时间:2016-03-09 15:04:03

标签: asp.net twitter-bootstrap twitter-bootstrap-3

我有这个aspx页面:

<%@ Page Title="Home" Language="C#" MasterPageFile="~/Store.master" AutoEventWireup="true"
    CodeFile="Default.aspx.cs" Inherits="_Default" %>

<asp:content id="Content1" contentplaceholderid="head" runat="Server">
</asp:content>
<asp:content id="Content2" contentplaceholderid="StoreMasterPlaceHolder" runat="Server">
    <table>
        <tr>
            <td class="tblBodySides">
                <div class="bodyDiv">
                    <!-- left Column -->
                    <table>
                        <tr>
                            <td class="tblBodySides">
                                <h4>
                                    look at our fantastic events
                                    <br />
                                    book one for today !
                                    <br />
                                    <hr />
                                </h4>
                                <h3>
                                    Events</h3>
                                <asp:calendar runat="server" class="cal" />
                            </td>
                            <td>
                            </td>
                            <td class="tblBodySides left_bord">
                                <h3>
                                    Here Are list of our Items colors:</h3>
                                <asp:gridview runat="server" id="gw1" datasourceid="XmlDataSource1">
                                </asp:gridview>
                                <asp:xmldatasource id="XmlDataSource1" runat="server" datafile="~/App_Data/items.xml">
                                </asp:xmldatasource>
                            </td>
                        </tr>
                    </table>
                </div>
            </td>
            <td class="tblBodyCenter">
            </td>
            <td class="tblBodySides">
                <div class="bodyDiv">
                    <!-- Right Column -->
                    <table>
                        <tr>
                            <td class="sides">
                            </td>
                            <td>
                                <h3>
                                    Definitions:
                                    <br />
                                    <hr />
                                </h3>
                                <ul>
                                    <li>
                                        <h2>
                                            CSS
                                        </h2>
                                    </li>
                                    <p class="justified left_bord">
                                    BLA BLA BLA</p>
                                   <br />
                                </ul>
                            </td>

                            <td class="sides">

                            </td>
                        </tr>
                    </table>
                </div>
            </td>
        </tr>
    </table>
</asp:content>

我想在上面的页面中使用bootstrap。

我将这些行放在上面:

  <link rel="stylesheet" href="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/css/bootstrap.min.css">
  <script src="https://ajax.googleapis.com/ajax/libs/jquery/1.12.0/jquery.min.js"></script>
  <script src="http://maxcdn.bootstrapcdn.com/bootstrap/3.3.6/js/bootstrap.min.js"></script>

2 个答案:

答案 0 :(得分:1)

在此部分内:

 <asp:content id="Content1" contentplaceholderid="head" runat="Server">
 </asp:content>

因为这是应放置在生成的HTML页面的head部分中的内容的内容区域。这就是为什么id是&#39; head&#39;。

答案 1 :(得分:0)

如果您正在使用母版页,那么请将链接代码写入母版页中的样式表,之后我们不想使用每个页面的链接代码只使用该母版页。