JeffreyFrancesco.org 公開日 タグ Tag Permalink 現在地 Facebook page Twitter RSS feed

暇だったので hr 要素のスタイルを弄って切り取り線っぽくしてみた。とはいっても基本的な作り自体は変えてない。背景画像をハサミにして、擬似要素で出しているボーダーのスタイルを破線にして、あとはマージンと色を少し調整したくらいだ。

ハサミの背景画像も単に游ゴシックの U+2702(BLACK SCISSORS)を Illustrator でアウトライン化して SVG 形式に書き出しただけなので、誰にでも作れるだろう。CSS コードはコアの部分を CodePen にデモの形で書き出しておいたので、あとは勝手に調べろ(投げやり)。とりあえず難しいことは何もやってない、はず。


Flexbox 使って書き直せばもう少しコードを減らせてすっきりするのだけど、これはまた後日気が向いたらやる。