Media Queries

モバイル表示の行間を調整するためにMedia Queriesを調べる。

【WordPress(Twenty Fourteen)で設定されているMedia Queries】
@media screen and (max-width:800px)
@media screen and (max-width: 400px)
@media screen and (max-width:320px)
@media screen and (min-width: 401px)
@media screen and (min-width: 594px)
@media screen and (min-width: 673px)
@media screen and (min-width: 783px)
@media screen and (min-width: 810px)
@media screen and (min-width: 846px)
@media screen and (min-width: 1008px)
@media screen and (min-width: 1040px)
@media screen and (min-width: 1080px)
@media screen and (min-width: 1110px)
@media screen and (min-width: 1218px)
@media screen and (min-width: 1260px)

【モバイルの画面サイズ】
iphone 4(320 × 480 )
iPhone 5(320 × 568 )
銀河S4(360 × 640 )
iphone 6(375 × 667 )
iPhone 7 Plus(414 × 736 )
Nexus 6P(411 × 731 )
Nexus 7(600 × 960 )
iPad Air(768 × 1024 )など
【閲覧モニタ解像度】
360 x 640
375 x 667
1366 x 768 
768 x 1024 
320 x 568 
1920 x 1080 
1680 x 1050
1280 x 1024
360 x 592
1600 x 900
414 x 736
1024 x 768 など

詳しく解らないのだけど、ここがポイントかと。
@media screen and (max-width: 400px)
iPhone 5(320 × 568 )iphone 6(375 × 667 )
@media screen and (min-width: 401px)
iPhone 7 Plus(414 × 736 )
@media screen and (min-width: 594px)
ネクサス7(600 × 960 )iPad Air(768 × 1024 )