以前からやってみたかったけど、いまいちよく分からなくて放置していたグリッドレイアウトが、他の調べ物をしていたら簡単に作成できるジェネレーターがあったのでメモ。
とにかく簡単!
横のマスと縦のマスの数と余白を入力して、作りたいレイアウトをマウスでビーっと引っ張るだけ!
画像を配置して、テキストも上に乗せたサンプルも作ってみました。
パソコンでもスマートフォンでも綺麗に表示できるので、イメージ重視でちょっと作りたいときにおすすめです!!
HTML
CSS
コードはたったこれだけ!!
DEMO用に作った、画像やテキストを配置したコードはこちら。
HTML
CSS
こんな簡単にグリッドレイアウトが作れるとは。
コメント