1

編集：

現在のレイアウト:

ここに画像の説明を入力

私の ASP Web ページ デザイン内で、div (サーバー側) を別の div の下に配置する方法を見つけようとしています。

さらに質問するには、次のスクリーンショットを使用します。

現在、これは私のレイアウトです：

ここに画像の説明を入力

次のように、さらに 2 つの div を下に配置して、'title' div と 'description' div tat を後でデータベースの結果に入力します。

ここに画像の説明を入力

これは私の現在のソースコードです。誰かが、これらの div をこのように重ねて実装する方法について正しい方向に私をプッシュできますか?

<%@ Page Title="" Language="C#" MasterPageFile="~/Site.Master" AutoEventWireup="true"  CodeBehind="Show.aspx.cs" Inherits="ViewCDs.Show" %>
<asp:Content ID="Content1" ContentPlaceHolderID="HeadContent" runat="server">
</asp:Content>
<asp:Content ID="Content2" ContentPlaceHolderID="MainContent" runat="server">

     <div style=" float:left;">
     <asp:Image ID="Image1" runat="server" Height="145px" ViewStateMode="Enabled" 
     Width="185px" />

      </div>
      <div style=" float:left; width: 395px; height: 140px;">

      <asp:FormView ID="FormView1" runat="server">
       <EditItemTemplate>
           coffeeName:
           <asp:TextBox ID="coffeeNameTextBox" runat="server" 
               Text='<%# Bind("coffeeName") %>' />
           <br />
           coffeeOrigin:
           <asp:TextBox ID="coffeeOriginTextBox" runat="server" 
               Text='<%# Bind("coffeeOrigin") %>' />
           <br />
           coffeeStrength:
           <asp:TextBox ID="coffeeStrengthTextBox" runat="server" 
               Text='<%# Bind("coffeeStrength") %>' />
           <br />
           coffeeGrind:
           <asp:TextBox ID="coffeeGrindTextBox" runat="server" 
               Text='<%# Bind("coffeeGrind") %>' />
           <br />
           coffeePrice:
           <asp:TextBox ID="coffeePriceTextBox" runat="server" 
               Text='<%# Bind("coffeePrice") %>' />
           <br />
           coffeeQty:
           <asp:TextBox ID="coffeeQtyTextBox" runat="server" 
               Text='<%# Bind("coffeeQty") %>' />
           <br />
           coffeeRRP:
           <asp:TextBox ID="coffeeRRPTextBox" runat="server" 
               Text='<%# Bind("coffeeRRP") %>' />
           <br />
           <asp:LinkButton ID="UpdateButton" runat="server" CausesValidation="True" 
               CommandName="Update" Text="Update" />
           &nbsp;<asp:LinkButton ID="UpdateCancelButton" runat="server" 
               CausesValidation="False" CommandName="Cancel" Text="Cancel" />
          </EditItemTemplate>
          <InsertItemTemplate>
           coffeeName:
           <asp:TextBox ID="coffeeNameTextBox" runat="server" 
               Text='<%# Bind("coffeeName") %>' />
           <br />
           coffeeOrigin:
           <asp:TextBox ID="coffeeOriginTextBox" runat="server" 
               Text='<%# Bind("coffeeOrigin") %>' />
           <br />
           coffeeStrength:
           <asp:TextBox ID="coffeeStrengthTextBox" runat="server" 
               Text='<%# Bind("coffeeStrength") %>' />
           <br />
           coffeeGrind:
           <asp:TextBox ID="coffeeGrindTextBox" runat="server" 
               Text='<%# Bind("coffeeGrind") %>' />
           <br />
           coffeePrice:
           <asp:TextBox ID="coffeePriceTextBox" runat="server" 
               Text='<%# Bind("coffeePrice") %>' />
           <br />
           coffeeQty:
           <asp:TextBox ID="coffeeQtyTextBox" runat="server" 
               Text='<%# Bind("coffeeQty") %>' />
           <br />
           coffeeRRP:
           <asp:TextBox ID="coffeeRRPTextBox" runat="server" 
               Text='<%# Bind("coffeeRRP") %>' />
           <br />
           <asp:LinkButton ID="InsertButton" runat="server" CausesValidation="True" 
               CommandName="Insert" Text="Insert" />
           &nbsp;<asp:LinkButton ID="InsertCancelButton" runat="server" 
               CausesValidation="False" CommandName="Cancel" Text="Cancel" />
           </InsertItemTemplate>
           <ItemTemplate>

           <b>Origin:</b>
           <asp:Label ID="coffeeOriginLabel" runat="server" 
               Text='<%# Bind("coffeeOrigin") %>' />
           <br />
           <br />
           <b>Grind:</b>
           <asp:Label ID="coffeeGrindLabel" runat="server" 
               Text='<%# Bind("coffeeGrind") %>' />
           <br />
           <br />
           <b>Price: £</b>
           <asp:Label ID="coffeePriceLabel" runat="server" 
               Text='<%# Bind("coffeePrice") %>' />
           <br />
           <br />
               <b>Strength:</b>
           <asp:Label ID="coffeeStrengthLabel" runat="server" 
               Text='<%# Bind("coffeeStrength") %>' />
           <br />
           <br />
           <b>Stock Level:</b>
           <asp:Label ID="coffeeQtyLabel" runat="server" Text='<%# Bind("coffeeQty") %>' />
           <br />


 </ItemTemplate>
 </asp:FormView>
 <asp:SqlDataSource ID="SqlDataSource1" runat="server" 
       ConnectionString="<%$ ConnectionStrings:CoffeeConnectionString %>" 
       SelectCommand="SELECT [coffeeName], [coffeeOrigin], [coffeeStrength], [coffeeGrind], [coffeePrice], [coffeeQty], [coffeeRRP] FROM [Coffees]">
</asp:SqlDataSource>

<br />
</div>

<div style=" float:left; width: 339px; height: 140px;">
<br />

<div style=" float:left; width: 165px; height: 25px;">

    <b><asp:Label ID="Label1" runat="server" Text="Select Coffee Grind:"></asp:Label>  </b>
</div>

<div style=" float:right; width: 165px; height: 25px;">
<asp:DropDownList ID="DropDownList1" runat="server" Height="21px" Width="161px">
    <asp:ListItem>Beans</asp:ListItem>
    <asp:ListItem>Smooth</asp:ListItem>
    <asp:ListItem>Course</asp:ListItem>
 </asp:DropDownList>
 </div>

  <div style=" float:left; width: 165px; height: 40px;">
  <br />
      <b><asp:Label ID="Label2" runat="server" Text="Quantity:"></asp:Label></b>
 </div>

  <div style=" float:right; width: 165px; height: 40px;">
  <br />

      <asp:TextBox ID="TextBox1" runat="server" Width="40px">1</asp:TextBox>

  </div>

  <div style=" float:left; width: 165px; height: 40px;">
  <br />

      <asp:Button ID="Button1" runat="server" Text="Buy" />

 </div>
 </div>

4

1 に答える 1

1

そのコードの下にさらに 2 つの div を追加するだけです。

<div id="title"> </div> <br/>
<div id="description"> </div> <br/>

ただし、可視性などの属性を制御したい場合は、それらの asp.net パネルを作成するだけで済みます。

<asp:Panel runat="server" ID="title"> </asp:Panel> <br/>
<asp:Panel runat="server" ID="description"> </asp:Panel> <br/>
于 2013-03-23T16:04:05.650 に答える