2023年6月3日 / 最終更新日時 : 2023年6月3日 あかひげ 記事 NanocでTailwindCSSを使う TailwindCSSがいいかんじなのでNanocでも使おうと言うメモ。 の二点が要旨となる。 TailwindCSSの導入 CDNから読むパターンのインストール方法で行く。 参考: Get started with T […]
2021年9月11日 / 最終更新日時 : 2023年5月12日 あかひげ 記事 Tailwind CSSがちょうどいい感じだった件 https://tailwindcss.com/ Next.jsとの組み合わせで使っていてなかなか良いと感じた。 実際使ってみた感想としては うむ快適。 Tailwind CSSをなぜ使うかという話は以下の解説が詳しい。 […]
2021年2月15日 / 最終更新日時 : 2021年2月15日 あかひげ 記事 IE11のElement.scrollLeftが効かないときにCSSを直した話 最近はJavaScriptとCSSを良く書いているのだが。IE11対応してると意外と動くじゃんと言う感想と投げ捨てたいという感想がないまぜになる。 ある要素内を横方向にスクロールしたいという処理でIE11だけどうにも動か […]
2020年9月10日 / 最終更新日時 : 2020年9月10日 あかひげ 記事 Reactのコンポーネントにスタイル適用どうするの 色々なコード見てると色々な書き方があって初心者からするとカオス。結論を言うと普通にCSS書いてclassNameでCSSクラスを指定する（classはJavaScriptの予約語のためPropsに使えない）のでOK。 色 […]
2020年7月11日 / 最終更新日時 : 2020年7月11日 あかひげ 記事 ブロックエディタにテーマ独自のクラスを利用したスタイルを適用する ブロックエディタの表示にテーマのCSSを当てると、コンテンツエリアは完全なWYSIWYGに近くなり、いちいちプレビューしないでもイメージ通りに編集していくことができる。そのためにはafter_setup_themeフック […]
2020年6月28日 / 最終更新日時 : 2020年7月22日 あかひげ 記事 このブログのデザインをリニューアルした おもむろに新しく作成した自作のテーマを先日適用した。まだ直したいところはあるがとりあえず形にはなっているので、完璧にこだわりすぎてエターナルしないように。 リニューアルの経緯 このブログは今まで既成のテーマを使っていたの […]
2020年6月17日 / 最終更新日時 : 2020年6月17日 あかひげ 隣接セレクタを使って要素の並びに応じたマージン調整を行う 見出しや段落といった要素の間にマージンを設定するのに、要素の並び方によって違和感を感じることがある。 例えばh3とh4であれば「h3のあと段落や画像など他の要素を挟んでh4となる場合」と「h3のすぐ下にh4となる場合」な […]
2020年5月25日 / 最終更新日時 : 2020年5月25日 あかひげ 久方ぶりにSASSを使ってみる このブログのリニューアルで久々に一からCSSを書いている。 そしてCSS設計の本を読んだこともありBEMを使ってみている。 それにともなって素のCSSを書いて行くのはだるいなということで久々にSASSを使ってみることに。 […]
2020年5月18日 / 最終更新日時 : 2020年6月2日 あかひげ CSS設計完全ガイドを読んでCSS設計完全に理解した カオスになりがちなCSSのコーディングをなんとかしたいと言うことで手に取ってみた。 CSS設計完全ガイド ～詳細解説＋実践的モジュール集 Amazon 単体のHTMLタグにスタイルを当てない方がいいとか、ID要素にスタイ […]
2008年9月18日 / 最終更新日時 : 2011年1月8日 あかひげ メンテしやすいCSSを書くための本 8月の頭くらいにちょっと行き詰まっていたことがあった。それはごちゃごちゃになったCSSのメンテナンスだ。 作って後はノータッチでいいのであれば適当にCSSを書いて行っても特に問題はないのだが、継続的に変更を加えていくよう […]
2008年4月13日 / 最終更新日時 : 2011年1月8日 あかひげ Yahoo! UI Libraryで3カラムレイアウトとかも Yahoo! UI Libraryで簡単に2カラムレイアウトの続き。 もうちょっとCSS Gridsの世界に踏み込むと3カラムのレイアウトとかそれ以上に複雑なレイアウトを作ることができる。 これもまたそんなに難しくはない […]
2008年3月26日 / 最終更新日時 : 2011年1月8日 あかひげ Yahoo! UI Libraryで簡単に2カラムレイアウト Yahoo! UI Library（以下YUI）のCSS Gridsが便利でよく使っているので簡単に紹介してみる。 YUIを使うとサイドバーつけたりとかでよく使う2カラムのレイアウトがさくっとできる。 次はコピペするだけ […]