Bootstrapの使い方超入門 (1/4) - ＠IT
話題のレスポンシブWebデザインも簡単にできる、CSSフレームワーク「Bootstrap」の概要と基本的な使い方をサンプルとコードを交えて紹介します。 最近はやりのHTML5、JavaScriptライブラリ、CSS3、APIの紹介、またそれらを組み合わせたサンプルアプリケーションの紹介と解説を厳選して紹介、解説していく本連載「HTML5アプリ作ろうぜ！」。今回紹介するフレームワークは「Bootstrap」です。 話題のレスポンシブWebデザインも簡単にできる、CSSフレームワーク「Bootstrap」とは 現在のWeb制作、開発では、ともにスピードが重視されています。「Bootstrap」を使用すると、既に用意されているスタイルを適用するだけで、格段に速く見栄えを整えられます。事実、Webシステムの管理画面などでBootstrapを使用するケースも増えてきました。 Bootstrapは最近
BootStrapに標準装備されてるのについつい再実装しがちな機能とかまとめ。 - NOT SO BAD
(photo credit: Nathan O’Nions via photopin cc) 最近あらためてBootstrapにはまってます。 Bootstrapでサイト作ってる時に標準の機能を知らんくて わざわざ同じ機能を自分でcss書いたりしてることが多かったので、 よく再実装しがちな機能をまとめメモ。 3.0でフラットデザインになって、いわゆるbootstrap臭もだいぶ薄れた気がするけどどうなんやろ。。 3.0つかったサイトが増えたらまた臭ってきそうな気もするけど。 ドキュメント 知らずに再実装しちゃう系の便利機能はCSSのHelper Classesとかに多い。 ので最初にひととおりドキュメント見とくのはいいですね。 当たり前やろって話やけど。。 Bootstrap「Helper Classes」 text-align 単純に中央揃えとか左揃えとかだけを指定するために
Bootstrapをさくさく自分好みに。専用カスタマイズサービス×12選
個人、会社を問わず素早くWebアプリケーションの開発がはじめられるとあって使われるようになっているのがBootstrapです。今回はそんなBootstrapのカスタマイズを素早く行っていけるWebサービスをまとめて紹介します！ StyleBootstrap.info ナビゲーションバー、ボタン、フォームなどの色、ボーダー、フォントサイズを細かくカスタマイズできます。リアルタイムプレビューがついていますのでその場で雰囲気が分かります。 StyleBootstrap.info: Twitter Bootstrap theme generator Initializr Bootstrapのカスタマイズという訳ではありませんが、HTML5 Webアプリケーションを開発するためのベースをカスタマイズしながら作成できます。 Initializr – Start an HTML5 Boilerplate
Twitter Bootstrapで出来たWordPressテーマ「WPBS」を使ってみる | はじめよう
» WordPress Bootstrap - A WordPress theme based on Twitter Bootstrap はじめに WordPressでCSSフレームワーク TwitterBootstrapを用いるためにWordPress Bootstrap「WPBS」というテーマを使ってみます。もちろん、投稿などでTwitterBootstrapサイトの様々な見た目を使うことができます。 このテーマ v2.1の設定方法について説明します。以下が手順です。 1. WPBSの導入WordPressテーマを WPBSに変更2. 各設定の確認と見た目の確認WPBSテーマの設定を確認3. 各設定の変更と見た目の確認WPBSテーマの設定を変更して、見た目を変えてみます 1. WPBSの導入 WordPress Bootstrapからテーマ（wordpress-bootstrap-v2
BootstrapのUIがドラッグアンドドロップだけで組める！最速でウェブのユーザーインターフェースが構築できるエディタ「Jetstrap」 - Chrome Life
先日、Twitter Bootstrapが2.1.1にアップデートされました。 Bootstrapが2.1になって大幅に機能も追加され、ウェブサイトを構築する上で必要なUIがほとんど揃っている感じがします。 最近では、スタートアップ系のWebサービスを作る人にとっては、Bootstrapが必要不可欠な存在になりつつあります。 とはいっても、Bootstrapに慣れていない人が、実際にページを作っていくにはコンポーネントのタグ構造やClass名を意識して作らないといけないので、少し難しい部分もあります。 Bootstrapのサイトを見ればマークアップのサンプルがあるので、それを見ながら作れば良いのですが1つ1つ確認しながら行うのも手間です。 そこで今回ご紹介するのが、BootstrapのUIをドラッグアンドドロップだけで簡単に組めるエディタ「Jetstrap」です。 jetstrap - B
レスポンシブでクールなCMS「Bolt」:phpspot開発日誌
Bolt - content management (1.0.2) - The Bolt website. レスポンシブでクールなCMS「Bolt」。 CMSは昔からありますが、レスポンシブでBootstrapベースのクールなCMSがオープンソースソフトウェアとして入手できます。 PHPとRDBによって書かれており、PHPな方にとってはカスタマイズなんかも簡単に出来そうです。設置やカスタマイズも簡単らしいです。 Bootstrapベースのクールなデザインとレスポンシブ対応が最初からなされているという所がポイントですね。 １つの選択肢の１つとして検証してみるのもよさそう 関連エントリ ZendFrameworkベースのCMS兼フレームワーク「Centurion」 ポートフォリオサイト構築専用のPHP＆MySQLなCMS「The Secretary」 ZendFrameworkとExtJSを使
属性設定で簡単にデータバリデーションが出来るJSフレームワーク「Parsley.js」:phpspot開発日誌
Parsley.js 属性設定で簡単にデータバリデーションが出来るJSフレームワーク「Parsley.js」 <input>に対して data-* の形で属性を設定すればデータのバリデーションが簡単にカッコよくできちゃうフレームワークです。 例えば、<input data-type="email">って記述しておけば、そのinputにメールアドレス以外が入力されていればエラーを検出出来ます。 emailだけでなく、数値、URL、アルファベット等のチェックに対応。その他、最低・最高の長さの設定や、必須項目、範囲設定、正規表現、リモートURLによるパラメータチェックができ、とにかくバリデーションするなら全体的に機能が詰まっています。サンプルサイトもBootstrapベースで作られていて、Bootstrapとも相性が良さそう。 FE側でのバリデーションをスマートにやりたいって方は評価してみてもよ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
http://lollyt.in/
これはスゴイぞ！Bootstrapのページ作成が積み木感覚で簡単にできてしまうジェネレーター -lollytin
ツチノコテクノロジー
Bootstrapなサイトで使えそうなクールなツールチップ実装jQueryプラグイン「Smallipop」:phpspot開発日誌
Bs3 Document | Greenapple-room
Twitter Bootstrap で使えるカラーピッカー＆日付ピッカー:phpspot開発日誌
phpspot開発日誌 - PHP/Ajax/JavaScript/CSS等の最新技術情報をお届け