CSS

HTML/CSS

CSSアニメーションのtransitionとanimation

CSSのアニメーションには「transition」と「animation」の二つの方法があります。 transitionとanimationの違い、そして一緒に使う機会が多い「transform」について簡単に整理しました。 tran...
HTML/CSS

グリッドレイアウトを構築するCSS

シンプルにグリッドレイアウトを構築するためのCSSです。 構造 グリッド全体を囲む「container」、グリッドの行(横並び部分)を囲む「row」、グリッドの個々の部分である「col(カラム)」で分かれています。カラム部分には幅を指定...
HTML/CSS

SMACSSとFlocssに触れてみて思ったこと

メンテナンス性の高いCSSを書くための手法として多くのCSS設計手法があります。その中でも有名なSMACSSとFLOCSSを小規模サイトのCSS設計で使ってみた感想を少しだけ記しておきます。 SMACSS Jonathan Snookさ...