こちらの画像は、CSS Shapeのshape-outsideという属性を使った一例。
斜めにカットされた透明png画像のカットラインに沿って、テキストがレイアウトされています。通常であれば下のラインに沿ってレイアウトされますが、shape-outsideを使うと雑紙のようなレイアウトも可能になるんですね。
文章の読みやすさでいえば通常のレイアウトで十分ですが、ちょっとインパクトのあるページにしたい場合などに用いると面白いかもしれません。
殆どのユーザーは気づかないかもしれませんが。
⛔️ adblockが有効になっています。
設定より http://vivablog.net/ で無効にしてください。
記事内にプロモーションを含む場合があります。
こちらの画像は、CSS Shapeのshape-outsideという属性を使った一例。
斜めにカットされた透明png画像のカットラインに沿って、テキストがレイアウトされています。通常であれば下のラインに沿ってレイアウトされますが、shape-outsideを使うと雑紙のようなレイアウトも可能になるんですね。
文章の読みやすさでいえば通常のレイアウトで十分ですが、ちょっとインパクトのあるページにしたい場合などに用いると面白いかもしれません。
殆どのユーザーは気づかないかもしれませんが。