ブートストラップにはどのような開発ツールがありますか?-ブートストラップのチュートリアル-php.cn

ブートストラップにはどのような開発ツールがありますか?

青灯夜游

リリース： 2021-10-29 11:51:03

オリジナル

4787 人が閲覧しました

ブートストラップ開発ツール: 1. Jetstrap; 2. Bootply; 3. DivShot; 4. Bootstrap Magic; 5. Layoutit; 6. X-editable; 7. Grid Displayer; 8. GetkickStrap など。

ブートストラップにはどのような開発ツールがありますか?

このチュートリアルの動作環境: Windows 7 システム、ブートストラップバージョン 3.3.7、DELL G3 コンピューター

Bootstrap は、アメリカの Twitter 企業 Mark Otto は、Jacob Thornton と協力して、HTML、CSS、および JavaScript に基づいたシンプルで直感的で強力なフロントエンド開発フレームワークを開発し、Web 開発を高速化しました。 Bootstrap は、動的 CSS 言語 Less で記述されたエレガントな HTML および CSS 仕様を提供します。

Bootstrap は発売以来非常に人気があり、NASA の MSNBC (Microsoft National Broadcasting Company) Breaking News など、GitHub 上の人気のオープンソースプロジェクトとなっています。 WeX5 フロントエンドオープンソースフレームワークなど、国内のモバイル開発者に馴染みのある一部のフレームワークも、Bootstrap ソースコードに基づいてパフォーマンスが最適化されています。

ブートストラップ開発ツール:

1. Jetstrap

Jetstrap は完全に Web ベースです。、Twitter Bootstrap 用のインターフェイス構築ツールで、開発者、デザイナーなどのために構築されています。 Jetstrap は、ほとんど労力をかけずに美しい Web サイトを迅速に作成するのに役立ちます。

2. Bootply

Bootply を使用すると、Bootstrap を簡単にデバッグできます。 CSS、HTML、JavaScriptを編集します。 Bootply を使用して、Bootstrap フレームワークの設計、プロトタイプ、拡張、またはテストを行うことができます。 Bootply は、他の人気のある Bootstrap プラグイン、マイクロライブラリ、およびフレームワークと統合します。

3. DivShot

Divshot は、Twitter Bootstrap を使用できるドラッグアンドドロップベースのフロントエンドエディターです (もちろん Foundation も使用できます) ) 応答性の高い Web サイトを構築します。DIY コーディングは、単純なドラッグアンドドロップ操作です。

4. Bootstrap Magic

Bootstrap Magic テーマジェネレーターは Twitter Bootstrap 3 と AngularJS に基づいて構築されています。独自の Twitter Bootstarp テーマをすばやく簡単に作成できます。変更内容をすぐに確認でき、Google Webfont から美しい Web フォントを追加できます。

5. Layoutit

LayoutIt は、Web サイトとインターフェースモデルを迅速に作成し、同時に生成された Web サイトコードをダウンロードするのに役立つ Twitter Bootstrap インターフェースジェネレーターです。わずか数回のドラッグアンドドロップ操作で、美しい Twitter Bootstrap Web サイトを作成できます。すべてのデザインはレスポンシブな CSS と流動的なものにすることができ、あらゆるプログラミング言語と簡単に統合できます。HTML をダウンロードするだけでデザインのコーディングを開始できます。

6、X-editable

X-editable は、Twitter Bootstrap、jQuery UI、または純粋な jQuery を使用したインプレース編集をサポートします。このライブラリを使用すると、Web ページ上に編集可能な要素を作成できます。これには、ポップアップモードとインラインモードが含まれます。テキスト、テキストエリア、ドロップダウンリスト、日付、dateui、チェックリストなどの入力要素をサポートします。クライアント側とサーバー側の検証をサポートします。さらに、コンテナの位置は完全にカスタマイズ可能で、ユーザーはシングルクリックまたはダブルクリックで自動または手動で切り替えることができます。

7. Grid Displayer

Grid Displayer は、Twitter Bootstrap (固定および流動グリッド) および Foundation (2.0 および 3.0) グリッドを表示するために使用できるブックマークツールです。。 Firefox および WebKit ベースのブラウザをサポートします。

8. GetkickStrap

Kickstrap は Bootstrap を完璧に組み合わせ、一流の Web テクノロジーを使用します。ネイティブバックエンドを必要とせずに、実証済みのデータベース駆動型 Web アプリケーションを実行できます。 JSPM.io と組み合わせた Kickstrap は、Require.js 上に構築された強力なフロントエンドパッケージの依存関係を提供します。キックストラップアプリケーションは、Web アプリケーションのライフサイクル中いつでも実行できる静的リソースのコレクションです。

9. Font Awesome

Font Awesome は、Twitter Boostrap 用に特別に設計されたアイコンフォントライブラリのセットです。このアイコンフォントセットは、Webページで使用されるほぼすべてのアイコンを網羅しており、Twitter Boostrapのデフォルトアイコンのほか、ソーシャルネットワークアイコン、Webアプリケーションアイコン、エディタアイコンなども含まれており、Webページで無料で使用できます。商業プロジェクト。

10. Bootstrap Button Generator

これは非常に便利な Twitter Bootstrap ボタン生成ツールです。割り当てたい新しいボタンスタイルを入力するだけです。ボタンの色が異なると、更新を即座にプレビューできます。

11、Easel

Easel は、ドキュメント内の特定の要素を他のファイルのプロトタイプアプリケーションにリンクできる、印象的な Twitter Bootstrap デザインツールです。ユーザーにテストに合格してもらい、早期にフィードバックを得ることができます。

12. Fancyboot

Fancyboot は、適切な量の制御を備え、不必要な複雑さをすべて取り除いた、シンプルかつ強力な Twitter Bootstrap カスタマイズツールです。

13、ブートストラップデザイナー

Bootstrap Designer 是一個線上設計工具，可以製作出非常漂亮的基於 Twitter Bootstrap 的 HTML5 模板。可以創造不同的設計風格：簡約風格，黑白，排版驅動的，單色的外觀，乾淨及創意等。

14、Bootsnipp

Bootsnipp 是一個元素畫廊，為網頁設計師和Web 開發人員設計，任何人使用Twitter Bootstrap 都會發現在他們的工作是必必不可少的。

15、PaintStrap

Paintstrap 讓你可以產生使用漂亮的 Twitter Bootstrap 主題，使用 Adobe Kuler 或 COLOURlovers 配色。