モバイルビューでフォントを反応させる必要があります

私は以下のようにメディアクエリを使用しようとしましたが、フォントサイズの％値を試してみました。私は18ptのフォントサイズを持っており、モバイルビューでは10ptのフォントサイズが必要です。 Googleにできる方法を試してみました。モバイルビューでフォントを反応させる必要があります

@media only screen and (max-width: 768px) { 
     user-access-panel .details-panel .panel-body { 
      padding: 0px 0px 0px 0px !important; 
      width: 100.29%; 
      height: 130px; 
      background-image: url("./images/icons/request-ID-card-bg.png"); 
      background-repeat: no-repeat; 
      background-position: center; 
      background-size: cover; 
      color: #3d4045; 
      /*font-family: Helv-neue-light;*/ 
      background-color: white; 
      font-family: sans-serif; 
      font-size: 10pt; 
      border: 1px solid lightgray; 
      box-shadow: 2px 2px 10px 1px lightgray; 
      vertical-align: middle; 
     } 
    }

出典

2017-02-28 FalconFlyer

しかし、デフォルトのフォントサイズは何ですか？メディアクエリの前に？ – mayersdesign

これは役に立ちます[link]（http://kyleschaeffer.com/development/css-font-size-em-vs-px-vs-pt-vs/） –

私のデフォルトのフォントサイズはメディアクエリの外です18ptです。 – FalconFlyer

pt印刷に使用される単位である - 画面のためにあなたはpx、またはより良いemまたはremを使用する必要があります。 remは、1 remがブラウザのデフォルトサイズであるため、通常は通常のテキスト（つまり、段落内、ヘッダーではない）の適切なサイズであるため、repsonsiveデザインに役立ちます。

出典

2017-02-28 11:11:09 Johannes

こんにちは、私は18ptを2.5 remに変更しました。しかし、応答可能なモバイルビューではフォントが縮小しませんでした。 – FalconFlyer

）1.投稿したルールは、このセレクタの 'user-access-panel .details-panel .panel-body'にのみ適用されます。より一般的なルール、または同じセレクタを使用して、通常のCSSの特定のルールを上書きするルールを設定してみてください。 2）2.5 remは非常に大きく、ほとんどのブラウザで40pxになるでしょう – Johannes

1.5rem *私の間違い。はい、ルールをその部分だけに適用したいと思う。どのように私は上書きすることができます。私はデフォルト値を設定し、モバイルビュー（メディアクエリを使用）の値を設定すると、デフォルト設定を上書きすると考えました。上書きの意味を指定できますか？ – FalconFlyer

vw単位は、この影響を達成する。ただし、このオプションのブラウザサポートをご確認ください：http://caniuse.com/#feat=viewport-units

.responsive-type {font-size: 15vw;}

<div class="responsive-type"> 
 
\t <p>I am responsive</p> 
 
</div>

出典

2017-02-28 11:39:09

モバイルビューでフォントを反応させる必要があります

答えて

関連する問題