4

(私のブラウザーで) ctrl + 0 で表示するデフォルトではなく、ctrl -、ctrl - を 2 回ズームアウトしたときに、Twitter ブートストラップを使用してすべてのアイテムのサイズが好きです。

ズームは、フォント サイズ、レスポンシブ デザイン、およびブートストラップを使用したいその他の多数の大きな理由に影響を与えるため、ハック的に幅を修正してそのすべてを壊したくはありません。

Bootstrap には、このズームやサイズ変更のようなものを生成するどこかで変更できる単一の CSS 値 (またはそれらの小さなセット) がありますか? ズームの設定自体はブラウザの問題であることに気付いたので、そのようにハードコーディングしたくありません。

編集

答えはこれに近いかもしれません：

Bootstrap を使用して body の最大幅を設定する

...それはノーを示唆していますか? ブートストラップを再コンパイルする必要がありますか?

4

3 に答える 3

14

css を使用すると、次のことができます。

body {
    zoom: 75%;
}

参照: http://dev.w3.org/csswg/css-device-adapt/#the-lsquozoomrsquo-descriptor

CSSで「ズーム」は何をしますか?

2013 年 8 月現在、ズームは Firefox でサポートされていないようです。

于 2013-08-30T15:21:47.630 に答える
2

あなたの質問への答えはイエスです - 少なくともフォントと、CSS を適切にコーディングしている場合。非常にトリッキーな非フォントについては、私の回答の後半を参照してください。

すべてのフォント サイズを制御できる CSS の 1 行は次のとおりです。

body {
  font-size: small;
}

多くの設計者は、厳密な制御を好むため、ピクセル サイズを使用して css をコーディングします。ただし、これには問題があります。Internet Explorer (IE9 まで) では、ピクセル単位が使用されている場合、テキスト サイズをオーバーライドできません。文字サイズを調整できる機能は、視力の弱い人にとって不可欠です (つまり、老眼のために 40 代以上の人 - 人口の大部分 - 団塊の世代と考えてください)。

CSS は、絶対サイズのキーワード (T シャツのサイズに似ています) をサポートしています。

  • xx小
  • 特小
  • 小さな
  • 中くらい
  • 大きい
  • ×ラージ
  • xx-ラージ

各サイズ間の倍率は約 1.5 です。smallキーワードは通常約 12 ピクセルですが、ブラウザーによって多少の違いがあります。

ベース サイズ (通常は「小さい」) を定義したら、パーセンテージを使用して、レイアウト全体で必要となるベース サイズに対する相対的なサイズを定義できます。たとえば、H1 要素をかなり大きくしたい場合は、次のようにします。

h1 {
  font-size: 150%;
}

したがって、任意の要素にパーセンテージを割り当てることができ、ボディに設定したベースよりも大きくまたは小さくすることができます。難しすぎず、質問のとおり、ドキュメント全体のフォント サイズを 1 つの CSS 値で調整できます。

さらに悪いニュースと良いニュースがあります。

悪いニュースは、ネストされた要素が親コンテナーからサイズを継承することです。したがって、#container を基本サイズの 95% に設定し、そのコンテナーに H1 要素を 150% に設定した場合、H1 は実際には 95% の 150% (1.5 x 0.95) になります。 = 1.425 なので、150% ではなく 142.5% です)。これは、さまざまなサイズのネスティングが多数ある場合は注意が必要です。

良いニュースは、rems ('root em's) が利用可能であり、rems を使用するということは、テキスト サイズが常にベース (ルート) フォントサイズに対して相対的にサイズ設定されることを意味します。

非フォントに関しては、それは良い質問です。フォント以外の要素を適切に拡大/サイズ変更したい場合は、CSS でピクセル定義ではなくパーセンテージ定義を使用する必要があることをお勧めします。

于 2012-12-07T10:45:31.563 に答える
2

答えは NO です。LESS からの再コンパイルがテーブルにある場合でも、ブートストラップ設定でこれを行う単一の簡単な方法はありません。

問題の核心は、ブートストラップ レスポンシブ デザインが大規模な 1200px ディスプレイで動作することです。これにより、1000px のラップトップのディスプレイが非常に拡大されたように見えます。

少ないファイルを直接編集して、フォントサイズを縮小し、幅1200とフォントサイズを..

  • 変数なし
  • メディアレス
  • レイアウト.レス
  • レスポンシブ-1200-min.less

そして、それはnavbarを壊したように見えました. ブートストラップ github からの私の理解では、少ない変数が示唆するよりもかなり多くのハードコーディングがあり、それが問題の多くを占めているということです。

于 2012-12-22T03:25:38.720 に答える