0

これを見る

一連の数字を取り、それらの周りに円を配置しようとしています。1 行に 1 つの円ではなく、1 つの長い水平線で表示するにはどうすればよいですか?

07、06、08、02、86、05、01、03、88、87、04

<div class="numberCircle">07</div>, <div class="numberCircle">06</div>, <div   class="numberCircle">08</div>, <div class="numberCircle">02</div>, <div class="numberCircle">86</div>, <div class="numberCircle">05</div>, <div class="numberCircle">01</div>, <div class="numberCircle">03</div>, <div class="numberCircle">88</div>, <div class="numberCircle">87</div>, <div class="numberCircle">04</div>, <div class="numberCircle">07</div>, <div class="numberCircle">06</div>,<label><b><del>08</b></del>, <b><del>02</b></del>, <b><del>05</b></del>, <b><del>01</b></del>, <b><del>87</b></del>, <b><del>04</b></del>, </label><br>

基本的に私は これを複製しようとしています。

4

5 に答える 5

1

単にdivブロックである要素（あなたが持っていないことを求めているもの）を使用しないでください。数字に意味がない場合（ありそうもない）、インラインのspan要素（display: inline-block;この場合はwith）を使用できます（基本的にはあなたが求めているもの）。 float: left;もオプションですが、CSS（スタイル）の決定はHTML（意味）の決定の後に行う必要があります。li多くの場合、順序付きリスト（）内の要素を使用する必要がありますol。

于 2012-04-25T03:11:21.057 に答える
1

CSS フロートを使用:

div.numberCircle {
  float: left;
}
于 2012-04-25T03:04:25.977 に答える
0

div.numberCircledisplay inline-blockプロパティを次のように定義できるようになりました

div.numberCircle {
display:inline-block;
   zoom:1; // for ie
*display:inline;  // for ie
}

ライブデモhttp://jsfiddle.net/rohitazad/QYSvB/

于 2012-04-25T04:10:09.637 に答える
0

試す：

div.numberCircle {
    float: left;
    clear:none;
}
于 2012-04-25T03:09:00.417 に答える
-1

こんにちは、 CSS3border -radiusプロパティを使用して簡単に番号に円を付けることができます。

また、IEサポートborder-radiusのコードでPIE.htcを適切に使用する場合、これはIEで機能します。{PIEはProgressiveInternetExplorerの略です。これはIEに関連付けられた動作であり、要素に適用すると、IEが多数のCSS3プロパティを認識して表示できるようになります。}

デモ画像に従って結果を取得するために、 CSS3カウンターインクリメントプロパティを使用して順序付きリストにコードを作成しました。

デモをご覧ください：-http： //jsfiddle.net/UjfBZ/10/

于 2012-04-25T06:44:09.453 に答える