-1

だから、私のウェブサイトでは、これをhttp://prntscr.com/vk3cvにしようとしています。ご覧のとおり、テキストは中央に配置されていません。HTML http://prntscr.com/vk3iyに次のコードがあり、CSS prntscr.com/vk3ml にこれがあります。

しかし、それはそれを中心にしていないようです。私は友人にそのコードを手伝ってもらいました。前に作ったコードはちょうど左揃えでした。完全に中央に配置するにはどうすればよいのでしょうか。

以前のコードでは、html が から に変更されDIV class="row" ましたDIV class="row feature"

featureそしてCSSでは、私はそのことを追加していませんでした.

4

2 に答える 2

1

基本的なオプション

  1. コンテナに固定幅を与え、margin:0 auto;
  2. コンテナーを HTML テーブル セル (または CSS テーブルを使用したネストされた div の同様のセット) に配置し、テーブル セルを指定します。text-align:center;
  3. JavaScript または jQuery を使用する

コンテナーの幅が可変の場合は、#2 または #3 が必要です。

#2 に決定した場合、この場合は CSS テーブルを使用する方が意味的に正しいです (データ グリッドには HTML テーブルを、レイアウトには CSS テーブルを優先します) (ここの最後の数段落を参照してください)。どちらも合理的な選択肢です。ただし、IE7 以前のサポートが必要な場合は、HTML テーブルを使用する必要があります。

自動マージン

.feature {
    width: 600px;
    margin: 0 auto;
}
.feature .3u {
    width: 200px;
}

CSS テーブル

<div class="table">
    <div class="row">
        <div class="cell">Content goes here</div>
    </div>
</div>
...
.table   {display: table;}
.row     {display: table-row;}
.cell    {display: table-cell;   text-align: center;}
.feature {display: inline-block; text-align: left;    width: auto;}
于 2013-03-09T02:33:26.177 に答える