0

4段落の最後にリンクがあります。何かのようなもの：

Here is my text, and it's just an example of text to show
And I am wanting to wrap the last bit of text, which happens
to be a link, but I need the link to either stay on the line
that is the available width and not break to another line,
unless it can't fit left-aligned on that line like this
http://mylink.com

したがって、これの実際のコードは HTML では次のようになります。

<p>Here is my text, and it's just an example of text to show
And I am wanting to wrap the last bit of text, which happens
to be a link, but I need the link to either stay on the line
that is the available width and not break to another line,
unless it can't fit left-aligned on that line like this<br />
<a href="http://mylink.com">http://mylink.com</a></p>

ここで使用していますが、実際に表示されるテキストの量が画面にキャプチャされ、次のように表示される場合があるため、<br />使用したくありません。<br />

Here is my text, and it's just an example of text to show And I am wanting to wrap
the last bit of text, which happens to be a link, but I need the link to either stay
on the line that is the available width and not break to another line, unless it can't 
fit left-aligned on that line like this
http://mylink.com

したがって、上記のような状況では、<br />タグを使用して分割しないようにする必要があり、代わりに次のようにレンダリングする必要があります。

Here is my text, and it's just an example of text to show And I am wanting to wrap
the last bit of text, which happens to be a link, but I need the link to either stay
on the line that is the available width and not break to another line, unless it can't 
fit left-aligned on that line like this http://mylink.com

CSS経由でこれを行うことは可能ですか？タグをまったくtext-align使用せずにこれを達成するために、おそらく何らかの価値がありますか? <br />ただし、リンクが自然に行に収まる場合は、次の行に移動しないでください。代わりに、その行に留まるべきです。

ありがとう！

4

3 に答える 3

0

改行なしのデフォルトのワードラップはすでにこれを行っていると思います。行に収まらない場合は次の行に移動しますが、収まる場合は次の行に移動しません。テキストが収まる親要素の幅を定義する必要があります。このフィドルをチェックしてください。

nothing you need to do in css.
于 2013-03-31T17:55:34.987 に答える
0

必要に応じてこの html を使用します。

<p>Here is my text, and it's just an example of text to show
And I am wanting to wrap the last bit of text, which happens
to be a link, but I need the link to either stay on the line
that is the available width and not break to another line,
unless it can't fit left-aligned on that line like this
<a href="http://mylink.com">http://mylink.com</a></p>

ただし、これを CSS に追加します。

a {
    display: block;
}

ただし、これによりaどこでも新しい行が作成されるため、このCSSでさらに指定する必要があります

p a {
    display: block;
}

jsfiddle の例http://jsfiddle.net/vzmtB/ ( を使用しないp a) とhttp://jsfiddle.net/vzmtB/1/ ( を使用する) を次に示しp aます。

于 2013-03-31T17:36:34.530 に答える