2

アドレスを形成するいくつかの行を含むDetailsViewコントロールがあります。理想的には、アドレス行を次の2つの行に「マージ」したいのですが、基本的にはそれらの間の境界線を削除します。

asp:TemplateFieldを使用して近似解を作成できると思います(単一の行を使用しますが、seconf(データ)セルで改行します)が、他の手段があるかどうかを確認したいと思います。以前のスタイリングと同じ行(CssClassを使用)。その上、これは他の何よりも学習演習です。

Address2 BoundFieldにクラスを与え、CSSを介して下と上の境界線を削除しようとしましたが、機能しないようです。HTMLを見ると、クラスが1つのセルに割り当てられていますが、このクラスを行全体に適用する必要があると思います。行全体に対処する手段はありません。列または1つのセルのいずれかで、すべての行を処理できます。

助言がありますか?

コードスニペット:

HTML:

<h2 class="title">Event Details</h2>
    <div class="entry">
        <form id="frmEvents" runat="server">
            <asp:DetailsView ID="vwEventDetails" runat="server" CssClass="vwEventDetails" FieldHeaderStyle-CssClass="FieldCol" >
                <Fields>
                    <asp:BoundField HeaderText="Event" DataField="EventName" ReadOnly="true" SortExpression="EventName" />
                    <asp:BoundField HeaderText="Date &amp; Time" DataField="EventDate" ReadOnly="true" SortExpression="EventDate" />
                    <asp:BoundField HeaderText="Address" DataField="Address1" ReadOnly="true" SortExpression="Address1" />
                    <asp:BoundField HeaderText="" DataField="Address2" ReadOnly="true" SortExpression="Address2" ItemStyle-CssClass="noBorders" />
                    <asp:BoundField HeaderText="" DataField="Address3" ReadOnly="true" SortExpression="Address3" />
                    <asp:BoundField HeaderText="Town" DataField="Town" ReadOnly="true" SortExpression="Town" />
                    <asp:BoundField HeaderText="County" DataField="County" ReadOnly="true" SortExpression="County" />
                    <asp:BoundField HeaderText="Postcode" DataField="Postcode" ReadOnly="true" SortExpression="Postcode" />
                    <asp:BoundField HeaderText="Entry Fee" DataField="EventFee" ReadOnly="true" SortExpression="EntryFee" />
                    <asp:BoundField HeaderText="Sponsor" DataField="SponsorName" ReadOnly="true" SortExpression="Sponsor" />
                    <asp:BoundField HeaderText="Category" DataField="CategoryName" ReadOnly="true" SortExpression="Category" />
                    <asp:HyperLinkField HeaderText="" DataTextField="" Text="Make A Booking" DataNavigateUrlFields="EventID" DataNavigateUrlFormatString="bookevent.aspx?eventid={0}" />
                </Fields>
            </asp:DetailsView>
        </form>
    </div>

CSS:

.vwEventDetails .FieldCol
{
    font-weight: bold;
    background-color: #99CCFF;
    width: 100px;
}

.vwEventDetails tr td
{
    padding: 0 2em;
}

.noBorders
{
    border-bottom-style:none;
    border-top-style:none;
}
4

1 に答える 1

0

私は2つのスタイルを使用します:

.noTopBorders { border-top: none; }
.noBottomBorders { border-bottom: none; }

「Address2」および「Address3」の BoundFieldsnoTopBordersHeaderStyle-CssClassおよびプロパティに割り当てます。ItemStyle-CssClass

「Address1」および「Address2」境界フィールドnoBottomBordersHeaderStyle-CssClassおよびプロパティに割り当てます。ItemStyle-CssClass

于 2009-01-17T21:39:03.623 に答える