タグ

改行に関するjytechのブックマーク (2)

  • 文章の折り返し指定のCSS最新版 - ICS MEDIA

    文章の折り返しはウェブ制作において意外と難しいものです。URLが文章に含まれている場合、URLがレイアウトを突き抜けてしまった、という経験をみなさんはお持ちではないでしょうか? この記事では、国内のウェブ制作において「開発者が考えることが少なくてよくなる」安全なCSS指定を紹介します。 結論から説明すると、以下の指定を提案します。 body { overflow-wrap: anywhere; /* 収まらない場合に折り返す */ word-break: normal; /* 単語の分割はデフォルトに依存 */ line-break: strict; /* 禁則処理を厳格に適用 */ } この記事では上記の指定にいたった理由と、折り返しの理解について必要なoverflow-wrapとword-breakプロパティを中心に解説します。 overflow-wrap overflow-wrapは

    文章の折り返し指定のCSS最新版 - ICS MEDIA
  • Webブラウザの日本語改行問題 -改行を実現するHTML/CSS-(1) - Qiita

    語のWebサイト(ランディングページ等)をつくっていると、読みにくい所で改行されるパターンがありますよね?実際この記事もブラウザの横幅によって単語の途中なのに改行されています。普通に文章を読んでいる時には良いのですが、これがランディングページのヘッドラインで起きるとものすごいカッコ悪いです。 たとえばPhotoshopのページで「写真のレタッチ、合成、カラー変更」というヘッドラインが以下のようになってたらいかがでしょうか?この場合はできれば、「合成、」の後で改行されている方が自然で読みやすくなっています。(ちなみにこれは、Chrome Developer Toolsで編集して、わざと見にくくしたので、実際にはキレイに改行処理しています)。 よーしそれじゃあ<br>入れれば良いんだなと真っ先に思いついた方がいるでしょう。しかし今日はさまざまなデバイスが皆さんのWebサイトに訪れています。

    Webブラウザの日本語改行問題 -改行を実現するHTML/CSS-(1) - Qiita
  • 1