lessを使ってBootstrapのデザインをカスタマイズ (1/5)
最近よく見かけるシングルページを作るデザイン塾。第2回では、ページの大まかなデザインを作成し、Bootstrapを使ってナビゲーションバーを実装しました。今回はlessファイルをカスタマイズして、オリジナルのデザインに近づけていきましょう。 index.htmlの<ul class="nav navbar-nav">内のリンクを書き換えます。検索フォームやドロップダウンメニューは今回使いませんので削除してOKです。 ■変更前ソースコード（index.htmlの一部、緑色部分を変更） <!-- Collect the nav links, forms, and other content for toggling --> <div class="collapse navbar-collapse" id="bs-example-navbar-collapse-1"> <ul class="na
LESSをはじめようと思ったらとりあえずBootstrapのmixinsを入れておくと便利
LESSをはじめようと思ったらとりあえずBootstrapのmixinsを入れておくと便利 LESSにはMixinという複数のプロパティをまとめる機能があります。 例えばcss3のベンダープレフィックスなど設定しておけば、あとで１行で呼び出すことができます。 で、実際作成するにあたり一から作るより Twitter Bootstrap を利用すれば、よく使いそうな機能があらかじめまとまってるのでいいかもしれないです。 投稿日2012年04月17日 更新日2012年04月17日 css3プロパティ 準備ができたところで早速使ってみましょう。 最初はCSS3で追加された「border-radius」で角丸にしてみます。 たとえば「id="box1"」でマークアップした「div」があります。 html <div id="box1"></div> 通常のcssでしたら次のようになりますよね。 css
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
