Question

我的任务是修改一些已经开发的Web应用程序的aspx页面。这些页面需要转换为使用新的Bootstrap布局。那么bootstrapping页面是什么意思？其中一个页面如下。请给我一些想法。

<%@ Page Language="VB" MasterPageFile="~/MasterExternal.master" AutoEventWireup="false" CodeFile="OptIt.aspx.vb" Inherits="OptIt" %>
<%@ MasterType VirtualPath="~/MasterExternal.master" %>
<asp:Content ID="c2" ContentPlaceHolderID="cpStyle" Runat="Server">
<style type="text/css">
    #middleContentContentParent {position:relative;left:50px;width:900px;}
    .dtText {font-size:22px;height:35px;line-height:35px;width:50px}
    input[type=text] {padding:0;}
</style>
</asp:Content>
<asp:Content ID="c3" ContentPlaceHolderID="cp3" Runat="Server">
    <form runat="server" id="aspnet">
        <div style="position:relative;width:860px;height:450px;margin:0 20px 0 20px">

        <h1>Opt-In to TXT Messaging</h1>
        <hr />
        <div style="text-align:left;" >
            <div runat="server" id="divFields">
                <p>
                Enter your cell phone noted in the email you just received to receive your TXT confirmation.  Then follow the directions in the TXT message.
                </p>    
                <br />
                <div style="width:360px;margin:0 auto;text-align:center">

                    <asp:ValidationSummary class="valSummaryLg"  ID="valSummary" runat="server" />

                    <h4>Mobile Number</h4>

                    <p style="text-align:left">
                    (<input runat="server" type="text" size="3" class="dtText" maxlength="3" id="CellPhone1_1" value="" /> ) <input class="dtText" runat="server" type="text" maxlength="3" size="3" id="CellPhone1_2" value="" /> - <input runat="server" type="text" maxlength="4" size="4" id="CellPhone1_3" class="dtText"  value="" />
                    <asp:CustomValidator runat="server" ID="valPhone" Text="*"></asp:CustomValidator>&nbsp; 
                    <br />

                    <br />
                    <asp:Button runat="server"  CssClass="button1Lg" ID="btnSubmit" Text="Submit" />
                    </p>
                </div>
            </div>

            <div runat="server" id="lblMessage" visible="false">
            <br /><br />
            <h2>Almost done... </h2>
            <p>
            Follow the instructions in the TXT you just received.  If you don't receive a TXT confirmation message, please see the "Commons Problems" below.
            </p>
            <br /><br />
            <h4>Common Problems with TXTing (using SHORT CODES):</h4>
            <p>
            FFPS uses a 5 digit "short code" to send TXT messages.  Short codes are used for businesses to ensure the sender is respecting the recipient's TXTing preferences.  Some carriers (like Sprint) require individuals to call and UNBLOCK SHORT CODES.  Some of the common problems with receiving FFPS TXT messages include:
            </p>
            <div style="margin:0 0 0 20px">
                <h5>You are using Wal-Mart Family Mobile</h5>
                <p><b>How to Fix:</b> Sorry, Wal-Mart does not support TXTing with Short Codes</p>
                <h5>You are using Sprint and they have blocked Short Codes</h5>
                <p><b>How to Fix:</b> Call Sprint and request to "Unblock Short Codes"</p>
            </div>
            </div>
        </div>
        </div>
    </form>
</asp:Content>

Answer 1

这是我自己的问题的答案。我已将此更改为使用bootstrap。我为每一行添加了行类。请看一下并提出一些想法。

    <%@ Page Language="VB" MasterPageFile="~/MasterExternal.master" AutoEventWireup="false" CodeFile="Default.aspx.vb" Inherits="Scholarship_Default" %>
    <%@ MasterType VirtualPath="~/MasterExternal.master" %>
    <asp:Content ID="c2" ContentPlaceHolderID="cpStyle" Runat="Server">
    <%--<style type="text/css">
        #middleContentContentParent {position:relative;left:50px;width:860px;}
        #divDownloadForms img {vertical-align:middle}
    </style>--%>
    </asp:Content>
    <asp:Content ID="c3" ContentPlaceHolderID="cp2" Runat="Server">
        <%--<div style="position:relative;width:820px;height:400px;margin:0 auto;">--%>
        <div>
            <div class="row">
                <h1>Scholarship Form</h1>
            </div>
            <div class="row">
                <h2>Instructions</h2>
            </div>
            <div class="row">            
                In order to apply for a scholarship, you will need to complete the Scholarship/Signup forms.  Please mail the 4 page form by the deadline stated below (otherwise, may cause delays or prevent placement).  Detailed instructions and the mailing address are found on the form (link below).<br />
            </div>
            <div class="row">
                <h2>Form Deadline</h2>
            </div>

                    <div id="divDownloadForms">
                        <div class="row"> 
                        For 
                            <b><asp:Label runat="server" ID="lblSeason"></asp:Label></b>, 
                            FFPS must receive your scholarship form by <b><asp:Label runat="server" ID="lblDate"></asp:Label></b>.

                        </div>
                        <div class="row">
                            <h5>Download the Scholarship/Signup Form - High Resolution (pdf)</h5>
                        </div>
                        <div class="row">
                            <img src="../images/icons/attach.gif" alt=""  />&nbsp;&nbsp;<a href="Stitch.aspx">Download File</a>
                        </div>    
                    </div>
        </div>
    </asp:Content>

Answer 2

假，如果你能展示现有的设计，那么我可以帮到你。您需要在行之间添加列网格，以便在所有视口中进行适当的查看。

引导页面是什么意思？将aspx转换为bootstrap？

2 个答案: