0

CSS は初めてで、ページのヘッダーとして凡例タグを組み込む方法を見つけようとしています。

現在、私のマスターページはフィールドセットによってスタイル設定されています: 

 fieldset.field_set_main
 {
     border-bottom-width:50px;
     border-top-width:100px;
     border-left-width:30px;
     border-right-width:30px;       
     margin:auto;    
     width:1300px;
     height:700px;
     padding:0px 0px 0px 0px;
     border-color:Black;    
     border-style:outset;  
     display:table;
}

legend.header
{          
     text-align:right;
}

<fieldset class="field_set_main" >
    <legend class="header">
        buy for you 
    </legend>                              
    <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
    </asp:ContentPlaceHolder>                                                                                  
</fieldset>

  1. 凡例のキャプションは、独自の背景色「白」で表示されます。黒に設定すると、キャプション テキスト自体「buy for you」だけが黒になります。境界線の右側に白いボックスとして表示されます。凡例がページのヘッダーとして表示される css スタイル (フィールドセットの背景色と同じ背景色、テキストの異なる前色)。

  2. fieldset にフッター要素はありますか?ページの下部にもキャプションを表示したいです。

  3. 有用な css スタイルの良いソースはありますか? 特にメインフィールドセットでスタイル設定されたマスターページの場合?
4

1 に答える 1

3

fieldsetページ全体のコンテナとして、およびlegendページ ヘッダーとして使用しようとしているようです。これは、これら 2 つの要素のセマンティクスの誤用です。

スタイリングのためにページをラップする要素が必要な場合は、マークアップと CSS を次のように変更することを強くお勧めします。

 .field_set_main {
     border: 30px solid black;
     border-bottom-width:50px;
     border-top-width:100px;
     margin:auto;    
     width:1300px;
     height:700px;
     padding: 0;
     display:table;
}

.header
{          
     text-align:right;
}

<div class="field_set_main" >
    <h1 class="header">
        buy for you 
    </h1>                              
    <asp:ContentPlaceHolder ID="ContentPlaceHolder1" runat="server">
    </asp:ContentPlaceHolder>                                                                                  
</div>

このlegendフィールドは、一貫して完全にスタイルを設定するのが難しいことで知られているため、意味的に重要でない限り、その使用は避けたいと思います。

于 2011-10-01T00:22:09.463 に答える