1

遠慮なく訂正してください。ただし、ブートストラップCSSについて私が理解していることから、spans1、2、3、4 ectを使用すると、Webページにデータを簡単にレイアウトできるようになります。1つの行全体がspan12であると想定されます。つまり、2つの6スパンは、内容が50/50の間隔で行全体に等しくなる必要がありますか？これは今のところ正しいですか？ 

<div class="hero-unit">
    <div class ="span4">First name: <input  type="text"  runat="server" placeholder="Enter First Name" name="firstname" id="firstname"/></div>
    <div class ="span4">Last name: <input  type="text"  runat="server" placeholder="Enter Last Name" name="lastname" id="lastname"/></div>
    <div class ="span2">Student Number: <input  type="text"  runat="server" placeholder="Enter Student Number" name="Student Number" id="StudentNumber"/> </div>
    <div class ="span2">Course code & Name:  <input  type="text"  runat="server" placeholder="Enter Course Code" name="CourseCode" id="CourseCode"/></div>
    <div class ="span4">Course code & Name: <input   type="text" runat="server" placeholder="Enter Course Code" name="CourseCode" id="Text1"/> </div>
</div>

結果は私が期待するように何も見えません。混乱したフォームの画像はこちらのサンプルhttp://img546.imageshack.us/img546/6361/35787686.png

4

1 に答える 1

1

トムのソリューションコードは以下のとおりです。-

<div class="row-fluid">
  <h1>Personal Details</h1></div><div class="row hero-unit">
  <div class="row-fluid">
    <div class ="span2">First name:</div> 
    <div class="span4">
      <input  type="text"  runat="server" 
              placeholder="Enter First Name" 
              name="Firstname" id="Firstname" />
    </div>
    <div class ="span2">Last name:</div> 
    <div class="span4">
       <input  type="text"  runat="server" 
               placeholder="Enter Last Name" 
               name="Lastname" id="Lastname"/>
    </div>
  </div>
  <div class="row-fluid">
    <div class ="span2">Student Number:</div> 
    <div class="span4"> 
      <input type="text"  runat="server" 
             placeholder="Enter Student Number" 
             name="Student Number" id="StudentNumber"/>
    </div>
    <div class ="span2">Course Name:</div> 
    <div class="span4"> 
      <input type="text"  runat="server" 
             placeholder="Enter Course Code" 
             name="CourseCode" id="CourseCode"/>
    </div> 
  </div>
  <div class="row-fluid">
    <div class ="span2">Mail Address:</div> 
    <div class="span10">
      <input type="text" class="span10" runat="server" 
             placeholder="Enter Postal Address" 
             name="PostalAddress" id="PostalAddress"/> 
    </div>
  </div>
</div>

より良いフォーマット結果はここで見ることができます：-http：//imageshack.us/photo/my-images/502/homepageim.png/

于 2012-08-16T22:59:16.123 に答える