CSS Media Sorguları

iPad Media Sorguları ( Tüm Nesiller – iPad Mini Dahil)

iPad Dikey ve Yatay Media Sorgusu

1
2
3
4
5
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px){
     background:red;
}

iPad Yatay Media Sorgusu

1
2
3
4
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape){}

iPad Dikey Media Sorgusu

1
2
3
4
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait){}

iPad 3 ve 4 Media Sorguları

Yalnızca 3. ve 4. nesil retina ipad’ler için geçerlidir.

Retina iPad Dikey ve Yatay Media Sorgusu

1
2
3
4
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (-webkit-min-device-pixel-ratio: 2){}

Retina iPad Yatay Media Sorgusu

1
2
3
4
5
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape)
and (-webkit-min-device-pixel-ratio: 2){}

Retina iPad Dikey Media Sorgusu

1
2
3
4
5
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio: 2){}

iPad 1 ve 2 Media Sorguları

iPad 1 ve 2 Dikey ve Yatay Media Sorgusu

1
2
3
4
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (-webkit-min-device-pixel-ratio: 1){}

iPad 1 ve 2 Yatay Media Sorgusu

1
2
3
4
5
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape)
and (-webkit-min-device-pixel-ratio: 1){}

iPad 1 ve 2 Dikey Media Sorgusu

1
2
3
4
5
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio: 1){}

iPad Mini Media Sorguları

iPad Mini Dikey ve Yatay Media Sorgusu

1
2
3
4
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (-webkit-min-device-pixel-ratio: 1)

iPad Mini Yatay Media  Sorgusu

1
2
3
4
5
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : landscape)
and (-webkit-min-device-pixel-ratio: 1){}

iPad Mini Dikey Media Sorgusu

1
2
3
4
5
@media only screen
and (min-device-width : 768px)
and (max-device-width : 1024px)
and (orientation : portrait)
and (-webkit-min-device-pixel-ratio: 1){}

iPhone Media Sorguları

iPhone 6 Media Sorguları

iPhone 6 Dikey ve Yatay Media Sorguları

1
2
3
@media only screen
and (min-device-width : 375px)
and (max-device-width : 667px){}

iPhone 6  Yatay Media Sorguları

1
2
3
4
@media only screen
and (min-device-width : 375px)
and (max-device-width : 667px)
and (orientation : landscape){}

iPhone 6  Dikey Media Sorguları

1
2
3
4
@media only screen
and (min-device-width : 375px)
and (max-device-width : 667px)
and (orientation : portrait){}

iPhone 6 Plus Media Sorguları

iPhone 6 Plus Dikey ve Yatay Media Sorguları

1
2
3
@media only screen
and (min-device-width : 414px)
and (max-device-width : 736px){}

iPhone 6 Plus  Yatay Media  Sorguları

1
2
3
4
@media only screen
and (min-device-width : 414px)
and (max-device-width : 736px)
and (orientation : landscape){}

iPhone 6 Plus  Dikey Media Sorguları

1
2
3
4
@media only screen
and (min-device-width : 414px)
and (max-device-width : 736px)
and (orientation : portrait){}

iPhone 5 ve 5S Media Sorguları

iPhone 5 ve 5S Dikey ve Yatay Media Sorguları

1
2
3
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px){}

iPhone 5 ve 5S Yatay Media Sorguları

1
2
3
4
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px)
and (orientation : landscape){}

iPhone 5 ve 5S Dikey Media Sorguları

1
2
3
4
@media only screen
and (min-device-width : 320px)
and (max-device-width : 568px)
and (orientation : portrait){}

iPhone 2G,3G,4,4S Media Sorguları

iPhone 2G-4S Dikey ve Yatay Media Sorguları

1
2
3
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px){}

iPhone 2G-4S Yatay Media Sorguları

1
2
3
4
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px)
and (orientation : landscape){}

iPhone 2G-4S Dikey Media  Sorguları

1
2
3
4
@media only screen
and (min-device-width : 320px)
and (max-device-width : 480px)
and (orientation : portrait){}