エントリーの編集
エントリーの編集は全ユーザーに共通の機能です。
必ずガイドラインを一読の上ご利用ください。
記事へのコメント1件
- 注目コメント
- 新着コメント
注目コメント算出アルゴリズムの一部にLINEヤフー株式会社の「建設的コメント順位付けモデルAPI」を使用しています
- バナー広告なし
- ミュート機能あり
- ダークモード搭載
関連記事
[フロントエンド] 文章の文末を省略するためCSS実装を3つ(1行の場合と、複数行の場合) - YoheiM .NET
こんにちは、@yoheiMuneです。 今日はCSSを用いて、文章の末尾を省略する方法を、ブログに書きたいと思... こんにちは、@yoheiMuneです。 今日はCSSを用いて、文章の末尾を省略する方法を、ブログに書きたいと思います。 目次 文章が1行の場合の文末省略 1行の文章の文末を省略するには、CSSのtext-overflow: ellipsis;を使います。 実際にはwidth、overflow、white-spaceのプロパティも合わせて指定します。 <p class="oneline-ellipsis">おはよう、こんにちは、さようなら、おやすみなさい。</p> <style> .oneline-ellipsis { /* 1. 横幅を指定する */ width : 200px; /* 2. はみ出した場合に、hiddenにする */ overflow: hidden; /* 3. 自動的な折り返しはしない */ white-space: nowrap; /* 4. 省略表現を指定する *
2018/07/12 リンク