CSS

CSS｜shape-outside + floatでテキストを画像のまわり円形状に回り込ませる

紙媒体で時々見かける画像にテキストが回り込んだデザイン。余白に無駄がなくオシャレに見えます。このような画像にテキストが回り込んだデザインは画像で作る必要はなく、CSSのみで実装が可能です。 CSSプロパティ shape...
CSS｜WordPressテーマCocoonの目次をCSSでカスタマイズする

WordPressテーマ Cocoonを利用してブログを運営している方の中には、見た目をカスタマイズして利用されている方もいれば、Cocoon標準のまま利用されている方もいらっしゃると思います。 Cocoonの標準の見た...
SCSSコンパイル時にimportしたSCSSファイルをCSSに書き出さないようにする

SCSSを使い始めて長らくなりますが、importしたSCSSファイルをCSSに書き出しをしたまま本日に至っていました。例えば、私は変数をまとめるSCSS（variables.scss）とslickテーマのSCSS（s...
CSS｜文字を縦書きにする方法

CSS（スタイルシート）で文字を縦書きにする方法を紹介します。原稿用紙の縦書きのイメージです。主には日本語（明朝体：Webフォント）でのデザインに使うことを想定しています。文字の縦書きに使うプロパティは「writin...