1

私は次の効果を得ようとしています：

ここに画像の説明を入力

基本的に私がやったことは、divを作成することです

display: table;

次に、Font Awesome アイコンを含む div を入力します。

display: table-cell;

JS フィドル: http://jsfiddle.net/abehnaz/wCHbc/1/

私の問題は、あるテーブルセルの中心から他のテーブルセルの中心に線を引く方法がわからないことです。誰かが私を正しい方向に向けることができますか?

編集：

これが私が探していたものを手に入れた方法です: http://jsfiddle.net/abehnaz/wCHbc/8/ . これはかなり冗長な解決策ですが、うまくいきます。私に残された唯一のことは、どうすればトップラインとボトムラインの間にギャップを作ることができるかを理解しようとすることです. 何かご意見は？

4

2 に答える 2

1

このソリューションを確認してください：http://jsfiddle.net/wCHbc/5/

基本的に、ラインである新しい div を作成し、単純な div レイアウトとして構造を復元しました。

.line{
    width:100%;
    position:relative;
    top:25px;
    left:0px;
    height:10px;
    background:#00f;
    z-index:-1;
}

シンボルの背景を透明にしたくない場合は、背景色を追加してください。

.icon-star, .icon-rss{
    background:#fff;
}
于 2013-08-26T14:38:42.393 に答える