0

テキストを水平線に配置しようとしています。テキストの長さが増加した場合、テキストの長さに応じて行を調整する必要があります。これは、IE7,8、Mozilla で正常に動作しています。Google Chrome で使えるようにしたいです。

Google Chrome 以外は正常に動作しています。これが私のコードです：

/*CSS*/
.pageHD{ font-size:30px; color:#369; font-weight:bold; padding:20px 0} .pageHD p{display:block; margin-right:10px}
.title-line{ height:1px; border:0 none; background:#e5e5e5; position: relative; right:0; top:0px} 
<!--HTML-->  
<div class="pageHD"><p class="left">Zones Showcases</p> <hr class="title-line" /></div>

誰でもこれを手伝ってもらえますか。ありがとう。！

4

2 に答える 2

0

あなたの質問について私が理解していることは次のとおりです。

テキストを hr 要素にオーバーラップさせたい。

私があなたの質問を誤解していなければ、これが私の答えです。

時間の後にコンテンツを作成して、時間と重なるようにします。

新しい HTML は次のようになります。

<div class="pageHD"><hr class="title-line" /></div>

新しい CSS は次のようになります。

.pageHD {
    font-size:30px;
    color:#369;
    font-weight:bold;
    padding:20px 0
}
.pageHD p {
    display:block;
    margin-right:10px
}
.title-line{
    height:1px;
    border:0 none;
    background:#e5e5e5;
    position: relative;
    right:0;
    top:0px;
    z-index: 0;
}
.title-line:after {
    position: absolute;
    content: 'Zone Showcases';
    bottom: -15px;
    z-index: 1;
}

ここに jsFiddle の例があります: jsFiddle の例

于 2013-08-07T15:04:54.000 に答える