はじめてBootstrap LESSをがっつりカスタマイズしたので、今回はその覚え書きです。 Bootstrap3 Lessを使用するにあたり、Gruntを導入したほうが俄然便利なため、今回はGruntの導入から説明いたします。 Botstrap LESSでカスタマイズする理由 前もって言ってしまうと、基本的なカスタマイズは公式サイトのカスタマイズページで十分すぎるくらい出来てしまいます(以前見た時よりも、ものすごく項目数が充実しているような気が…)。 そのため、わざわざLESSを使い、さらには環境を整えてやる必要があるかと言われれば、使用目的によっては不要かもしれないですね。 ただ、LESSでのカスタマイズだと公式サイト以上の編集が容易にスピーディーにでき、もしも途中で大幅な仕様変更があった場合でも柔軟に対応できます。 また、構造把握や管理がしっかりできるので、今後もBootstrapを
#1. 目的 はじめてBootstrapを使ってWEBページをつくってみようとしました。 CSSをカスタマイズのためにはコンパイルが必要ということに気づく lessって何? コンパイルできて、カスタマイズできる環境にまで ←ここまで 環境は、MacOSX 10.9.5 #2. Bootstrapを使う準備 公式サイトからソースコードのダウンロード。 ディレクトリ構造は以下のとおり。 前もってコンパイルされたCSSがはいっています。 Getting StartedにあるBasicテンプレートをindex.htmlとしてコピーして __/User/hogehoge/bootstrap/dist/__に置きましょう。 __/User/hogehoge/bootstrap/dist/__をApacheのドキュメントルートにして、 apacheを起動して、表示を確認してみましょう。 Hello Wo
Bootstrap 3 RC1では、ビルドシステムがmakeからGruntへ変更されています。このGruntを使うと、lessファイルやJavaScriptファイルの変更を監視し、自動でビルド、といったことができます。 RC1ではサイトからLESSの変数をカスタマイズすることができなくなっているので、自分でLESSコンパイルが必要です。そのときに予め用意されたGruntをを使うと楽です。ただこの方法が以前のように書かれていないようなので、調査ついでに試してみました。 事前準備 nodeをインストールしましょう。 grunt-cliのインストール Gruntを使えるようにします。Grunt 0.3からは、gruntのコマンドラインインターフェースであるgrunt-cliをインストールして利用するようになっています。0.3未満のGruntを使用していた場合は、npm uninstall -g
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く