CSS

記事の表示は投稿日時順です

WordPress のCSSにFLOCSSを導入する

2024.01.15

CSS, Wordpress

現在、3つのサイトを運用しているのですが、やっと最後のサイトを完全オリジナルテーマに変更しました。サイト「@半径とことこ60分」公開はてなブログから WordPress に移行したのが...

画像をSVGで切り抜く clip-path, mask

2023.12.16

CSS

前記事「GIMP 初期状態に戻す、パスツールを使う」では、GIMP で葉っぱの SVG ファイルをつくり画像を切り抜く過程を記事にしましたが、その際、CSS のプロパティ clip-path がなかなか思うような結果を...

SassとFLOCSSでテーマ開発を効率化

2023.11.17

CSS

WordPress のテーマ開発をプラグインの wp-scss から node.js 上で gulp を走らせる方法に変えましたので、この際、CSS の設計思想に FLOCSS というものを取り入れてみようと思います。...

scroll-behavior:smoothは履歴に残る

2023.08.30

CSS, javascript

CSS だけでスムーススクロールが実装できる scroll-behavior: smooth は簡単でいいのですが、デメリットも多く、一番抵抗のあるのはブラウザの履歴に残ることです。スムーススク...

はてなブログ:テーマを変えた imzReading

2021.02.23

CSS, はてなブログ

やっとこのブログのテーマを変えることができました。変えようと思い始めて数ヶ月、なのに印象はあまり変わらない結果となりました(笑)。白ベースを基本にしていますのでまあこんなもんでしょう。変更のポイントをあげておきます...

CSS opacity: 0 のリンクを消す

2019.10.08

CSS

aタグやクリックイベントを持った要素の領域を保持したまま、css だけでフェードインしたりフェードアウトしたりする方法です。必要なときはさほど多くないと思いますが、これが一番簡単かなという方法を思いつきましたのでメモ程...

はてなブログに CSS Grid Layout を使ってみる

2019.09.23

CSS, はてなブログ

実はもうすでにこのブログやテーマストアで公開しているテーマでも基本レイアウトには Grid Layout を使っているのですが、もっと活用できないかといろいろやってみましたら、はてなブログのコンテンツ内でもかなり便利に使...