@mediaメディアクエリが無効になった原因のまとめ
649 ワード
1.セレクタの権限が正しいかどうか:
例えば、画面幅を500 pxから1024 pxの間に設定し、pラベルの文字サイズは12 pxである.
ただし、一部のpタグのcss権限[上のdiv pの文字サイズは変わらない]が@mediaのp権限より高い場合は有効ではない.
2.and前後のスペースの問題
ここでand前後にスペースの間隔を確保する必要がある.
3.meta宣言
携帯電話端末の開発の場合、それを設定する必要があり、pc端末は要求しない.
div p{
font-size: 14px;
}
@media screen and (min-width:500px) and (max-width:1024px){
p{
font-size: 12px;
}
}
例えば、画面幅を500 pxから1024 pxの間に設定し、pラベルの文字サイズは12 pxである.
ただし、一部のpタグのcss権限[上のdiv pの文字サイズは変わらない]が@mediaのp権限より高い場合は有効ではない.
2.and前後のスペースの問題
@media screen and (min-width:500px) and (max-width:1024px){
p{
font-size: 12px;
}
}
ここでand前後にスペースの間隔を確保する必要がある.
3.meta宣言
携帯電話端末の開発の場合、それを設定する必要があり、pc端末は要求しない.