bootstrap

CSS Twitter Bootstrapにチャレンジ ~Jetstrapとは~ 【入門編 第2回】

この記事は2012年9月24日に書かれたものです。内容が古い可能性がありますのでご注意ください。


CSS Twitter Bootstrapにチャレンジ ~Jetstrapとは~ 【入門編 第2回】

Jetstrap

第一回で、Twitter社謹製CSSフレームワーク「Bootstrap」についてご紹介しました。
今回ご紹介するのは、Bootstrapをさらに便利に扱える驚愕のフレームワーク
「Jetstrap」をご紹介します。

http://jetstrap.com/

このJetstrap、何がすごいかというと、Bootstrapの画面をドラッグ&ドロップで作れてしまうということです。
これはかなり画期的ではないでしょうか?

ではまずは使い方から説明していきましょう。

Jetstrap公式サイト

Twitter、Google、GitHubのいずれかのアカウントでログインできます。

▼こちらが編集画面です。

Jetstrap編集画面

▼上の編集画面を拡大したのがこちら。

文字のところをダブルクリックすれば、そのまま編集ができてしまいます。
文字入力

▼ボタンもこのとおり、ドラッグ&ドロップで簡単に配置できる。

ボタン配置

▼編集したデータは、HTMLとCSSファイルとしてダウンロードすることができます。

HTML・CSS書き出し

デザインが苦手な人でも、ちょっぱやでWebインターフェースが作れる!

Bootstrapはコンポーネントを覚えるのが億劫だったりと、簡単なばかりではない面も。
そのへんをPowerpointのような感覚で操作できてしまうJetstrap。
一度触ってみると、やみ付きになるかもしれませんね。

  • このエントリーをはてなブックマークに追加

コメント

  1. この記事へのコメントはありません。

  1. この記事へのトラックバックはありません。

PAGE TOP