2017-01-27 1 views
-1

私はテーブルを持っています。この表の1列は電子メールアドレスです。電子メールは空白のない文字列です。電子メールアドレスのテキストを '@'や '。'のような特定の文字で表のセルに分割する方法はありますか?

十分なスペースがない場合、このテキストを '@'と '。'の機能で複数の行に分割する必要があります。文字。

[email protected] 
[email protected] 

これは私が期待するものである:

[email protected] 
richard 
.developer 
@email.com 

これは私が期待していないものです。

[email protected] 
richard. 
developer 
@email.com 

どのように私は、この使用を実現することができ、次の電子メールの文字列が与えられ

CSSとHTML?

答えて

0

二つの方法:

方法1(IEではない作品)

<td> 
     richard<wbr>.<wbr>developer<wbr>@<wbr>gmail<wbr>.<wbr>com 
</td> 

おかげでn_ermoshする方法2: Specifying a preferred line break point in HTML text in a responsive design

CSS:

.break { 
    display: inline-block; 
} 

HTML:ジョモへ

<td> 
    <span class="break">richard</span> 
    <span class="break">.</span> 
    <span class="break">developer</span> 
    <span class="break">@</span> 
    <span class="break">developer</span> 
    <span class="break">.</span> 
    <span class="break">com</span> 
</td> 

おかげで:返信用 Specifying a preferred line break point in HTML text in a responsive design

1

他の効果を得ることができますか?テキストがコンテナよりも長い場合は3つの点がありますか?解決

td span{ 
 
    display:block; 
 
    width: 100px; 
 
    overflow: hidden; 
 
    text-overflow: ellipsis; 
 
}
<table> 
 
    <tr> 
 
    <td><span>[email protected]</span></td> 
 
    </tr> 
 
</table> 
 

+0

感謝。これは私がこの場合に必要とするものではありません。残念ながらそれは動作しません。また、列サイズが定義されていない状況。他の2つの列だけが特定のサイズを持ちます。 – Natanael

関連する問題