1 
/* Normal Bubble */
.bubble {
    width: auto;
    font-size: 0.75em;
    margin-bottom: 24px;
}

.bubble blockquote {
    margin: 0px;
    padding: 0px;
    border: 1px solid #c9c2c1;
    background-color: #000;
}

.bubble blockquote p {
    margin: 10px;
    padding: 0px;
        font-size: 21px;
}

.bubble cite {
    position: relative;
    margin: 0px;
    padding: 7px 0px 0px 15px;
    top: 6px;
    background: transparent url(b/tip.gif) no-repeat 20px 0;
    font-style: normal;
}

コメント用にこれを持っています..「吹き出し」のように見えます。

最初から大きくしたくないので、テキストの後にカスタムしたい..「こんにちは」と書いた場合、バブルから1〜2ピクセルのマージンでその周りにある必要があるため、「こんにちは」と書いた場合私の名前は、料理が好きです！」それならもっと大きくなるはずです..今はこんな感じです：

    <div class="bubble">
            <blockquote>
<p>the comment text is here</p>
        </blockquote>
        <cite>Written by me</cite>
</div>
4

3 に答える 3

1

デフォルトでは、div はブロック レベルであるため、その幅は (コンテンツではなく) 親コンテナーの幅に拡張されます。

考慮すべき2つのオプションは、divをに設定することです

表示: インラインブロック

もしくは浮かせます。

于 2010-02-25T16:14:36.910 に答える
0

そう言いたいのか？

.bubble blockquote p {
    display: inline;
    /*(...)*/
}

http://www.htmldog.com/reference/cssproperties/display/を参照してください。

于 2010-02-25T16:02:59.797 に答える
0

あなたが何を求めているのかよくわかりません。

おそらく、コンテンツのサイズに応じて拡大縮小する (画像を使用した) ポップアップの作成について言及しているのでしょうか? そのためには、複数の重なり合う画像が必要です。一方向 (垂直または水平) にのみスケーリングする場合は 2 つの画像が必要です。両方向にスケーリングする場合は、4 つの画像を作成する必要があります。この手法は「引き戸」と呼ばれることもあります。

于 2010-02-25T16:10:53.070 に答える