TwitterBootstrap
をテンプレートにして作成
[
トップ
] [
新規
|
一覧
|
検索
|
最終更新
|
ヘルプ
|
ログイン
]
開始行:
&tag(TwitterBootstrap);
*目次 [#yc7d593f]
#contents
*関連ページ [#q7b16882]
-[[Bootstrap3]]
*参考情報 [#v931ea14]
-[[Bootstrap, from Twitter:http://twitter.github.com/boot...
-[[Built With Bootstrap:http://builtwithbootstrap.com/]]…...
-[[Bootswatch: Themed swatches for Twitter Bootstrap:http...
-[[Twitter Bootstrapが大幅バージョンアップ！して凄まじい...
-[[Twitter謹製のCSSフレームワーク『Bootstrap』が大幅バー...
-[[twitter bootstrap railsを使ったら職が見つかり彼女も出...
-[[これからTwitter Bootstrapをはじめる人のためのエントリ...
-[[ツイッター・ブートストラップ使用例:http://guide.withab...
-[[Twitter Bootstrapの使い方:http://greenapple-room.com/c...
-[[Gallery of free HTML snippets for Twitter Bootstrap. |...
-[[TwitterBootstrapWithRails]]
*導入方法 [#ja7f67b5]
-[[Twitter Bootstrapの導入への3ステップ:http://blog.great...
-cssを使う方法、lessを使ってjsで展開する方法、コマンドラ...
**コンパイル済みcssを組み込む [#p752e16a]
-公式サイトからbootstrap.zipをダウンロード。
-bootstrapフォルダをindex.htmlファイルと同じ場所にコピー...
#pre{{
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional...
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; c...
<title>Bootstrap 101 Template</title>
<meta name="viewport" content="width=device-width, in...
<!-- Bootstrap -->
<link href="bootstrap/css/bootstrap.min.css" rel="sty...
</head>
<body>
<body>
<h1>Hello, world!</h1>
<script src="http://code.jquery.com/jquery.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<div class="hero-unit">
<h1>Hello, world!</h1>
<p>This is a template for a simple marketing or infor...
<p><a href="#" class="btn btn-primary btn-large">Lear...
</div>
</body>
</body>
</html>
}}
**ソースからコンパイルしてみる [#s1b5223c]
-先に[[npm]]のインストールが必要。
-ソースの展開
git clone https://github.com/twitter/bootstrap
-ディレクトリに移動し、
npm install
make
**使用方法 [#ce7d3a02]
-headタグ内に以下のようにしこむ。bootstrap-responsiveはレ...
#pre{{
<link href="bootstrap/css/bootstrap.min.css" rel="sty...
<link href="bootstrap/css/bootstrap-responsive.min.cs...
<script src="http://code.jquery.com/jquery.js" type="...
<script src="bootstrap/js/bootstrap.min.js" type="tex...
}}
*グリッドの使い方など [#b1542733]
**参考情報 [#d95f3012]
-[[Twitter Bootstrapのグリッド機能で段組を作成 [ホームペ...
**containerとrowの役割ってなに? [#bd148078]
-[[Twitter Bootstrap – How to Style Rows – Ph...
-containerは940px。rowは960pxで-20px、spanは20pxのマージ...
-つまり、span4などを直接いれてレイアウトしない場合、rowは...
-[[Bootstrap, from Twitter:http://twitter.github.io/boots...
**ネストするとき [#r0370696]
-rowのときは、コンテナの列数に合うようにする。row-fluidの...
*フォーム [#l9dabf3e]
**参考情報 [#j9fb22db]
-[[Base · Bootstrap:http://twitter.github.io/bootstr...
-[[Bootstrap：Base CSS:http://greenapple-room.com/conc/us...
終了行:
&tag(TwitterBootstrap);
*目次 [#yc7d593f]
#contents
*関連ページ [#q7b16882]
-[[Bootstrap3]]
*参考情報 [#v931ea14]
-[[Bootstrap, from Twitter:http://twitter.github.com/boot...
-[[Built With Bootstrap:http://builtwithbootstrap.com/]]…...
-[[Bootswatch: Themed swatches for Twitter Bootstrap:http...
-[[Twitter Bootstrapが大幅バージョンアップ！して凄まじい...
-[[Twitter謹製のCSSフレームワーク『Bootstrap』が大幅バー...
-[[twitter bootstrap railsを使ったら職が見つかり彼女も出...
-[[これからTwitter Bootstrapをはじめる人のためのエントリ...
-[[ツイッター・ブートストラップ使用例:http://guide.withab...
-[[Twitter Bootstrapの使い方:http://greenapple-room.com/c...
-[[Gallery of free HTML snippets for Twitter Bootstrap. |...
-[[TwitterBootstrapWithRails]]
*導入方法 [#ja7f67b5]
-[[Twitter Bootstrapの導入への3ステップ:http://blog.great...
-cssを使う方法、lessを使ってjsで展開する方法、コマンドラ...
**コンパイル済みcssを組み込む [#p752e16a]
-公式サイトからbootstrap.zipをダウンロード。
-bootstrapフォルダをindex.htmlファイルと同じ場所にコピー...
#pre{{
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional...
"http://www.w3.org/TR/html4/loose.dtd">
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; c...
<title>Bootstrap 101 Template</title>
<meta name="viewport" content="width=device-width, in...
<!-- Bootstrap -->
<link href="bootstrap/css/bootstrap.min.css" rel="sty...
</head>
<body>
<body>
<h1>Hello, world!</h1>
<script src="http://code.jquery.com/jquery.js"></script>
<script src="bootstrap/js/bootstrap.min.js"></script>
<div class="hero-unit">
<h1>Hello, world!</h1>
<p>This is a template for a simple marketing or infor...
<p><a href="#" class="btn btn-primary btn-large">Lear...
</div>
</body>
</body>
</html>
}}
**ソースからコンパイルしてみる [#s1b5223c]
-先に[[npm]]のインストールが必要。
-ソースの展開
git clone https://github.com/twitter/bootstrap
-ディレクトリに移動し、
npm install
make
**使用方法 [#ce7d3a02]
-headタグ内に以下のようにしこむ。bootstrap-responsiveはレ...
#pre{{
<link href="bootstrap/css/bootstrap.min.css" rel="sty...
<link href="bootstrap/css/bootstrap-responsive.min.cs...
<script src="http://code.jquery.com/jquery.js" type="...
<script src="bootstrap/js/bootstrap.min.js" type="tex...
}}
*グリッドの使い方など [#b1542733]
**参考情報 [#d95f3012]
-[[Twitter Bootstrapのグリッド機能で段組を作成 [ホームペ...
**containerとrowの役割ってなに? [#bd148078]
-[[Twitter Bootstrap – How to Style Rows – Ph...
-containerは940px。rowは960pxで-20px、spanは20pxのマージ...
-つまり、span4などを直接いれてレイアウトしない場合、rowは...
-[[Bootstrap, from Twitter:http://twitter.github.io/boots...
**ネストするとき [#r0370696]
-rowのときは、コンテナの列数に合うようにする。row-fluidの...
*フォーム [#l9dabf3e]
**参考情報 [#j9fb22db]
-[[Base · Bootstrap:http://twitter.github.io/bootstr...
-[[Bootstrap：Base CSS:http://greenapple-room.com/conc/us...
ページ名:
![[PukiWiki]](image/pukiwiki.png "[PukiWiki]")
