うわっ、私のサイトBootstrapくさすぎ!? たった数文字変えるだけでBootstrapのくさみが抜ける7つのCSSテクニック。
なんか、このサイトBootstrapくさい。そう感じることはありませんか? その理由はズバリ、欧文ベースでつくられたフレームワークを文字構造の違う日本語で適用した際に不都合が出てしまっているからです。 それらが醸し出す違和感を放っておくと、Bootstrapくささを生み出す大きな原因になってしまいます。 そもそもの問題として、欧文と比較して和文は文字の要素が多く、文字自体のリズムも少ないため、どうしても複雑で単調に見えてしまいます。 しかし、和文だからといってあきらめることはありません。BootstrapのCSSを少しだけ変えるだけでグッと見た目がよくなる隠し味をご紹介します。 1. line-heightで行間にゆとりを。明朝やゴシックなど、フォントの種類が言葉の印象を表すように、文字の行間は読みやすさ、文章全体の雰囲気を左右します。 欧文をベースに設計されたBootstrapをそのまま
Bootstrapでメディアクエリを書き加える時の指定方法について整理する - Phiyard Blog
2015-04-12 Bootstrapでメディアクエリを書き加える時の指定方法について整理する Bootstrap WebDev max-widthかmin-widthかで、境目の数字が異なるので、そこが混乱の元なんですな。自分でも今日とぼけて間違って指定してしまっていたので、ここに整理しておきます。 参照するのは、Bootstrap公式サイトのCSSのページの中のgrid optionsです。 まず、おさらいも含めて、Bootstrapがどのように指定しているのかを見ます。だいたい次のようなかたちです。 @media (min-width: 768px) { .container { width: 750px; } } @media (min-width: 992px) { .container { width: 970px; } } @media (min-width: 1200
bootstrap-sass でレスポンシブなはてなブログのテーマを作る - MANA-DOT
最近このブログのテーマを一新しましたが、その際に Bootstrap を利用しました。 はてなブログで Bootstrap を利用するために、sass によるセレクタの継承、uncss による不必要なセレクタの除去と一手間かけたので、その方法を紹介します。 はてなブログのテーマで Bootstrap を使うために sass の extend を使う はてなブログのテーマは、基本的に用意された html に対して当てる css をカスタマイズすることが出来るだけです。 Bootstrap を利用する場合、通常だと Bootstrap で用意されたクラスを html の要素に振っていくこととなると思いますが、予め html が用意されているため、それが出来ません。 そこで、bootstrap-sass を利用して sass でテーマ css を作り、Bootstrap のクラスをはてなのデザイ
1
リリース、障害情報などのサービスのお知らせ
最新の人気エントリーの配信
処理を実行中です
j次のブックマーク
k前のブックマーク
lあとで読む
eコメント一覧を開く
oページを開く
Drop jQuery From Your Bootstrap Project (And Replace it with Vue.js!)
Bootstrapで作られたとは思えないほど洗練されたデザインのWebサイトのまとめ
