Your SlideShare is downloading. ×
WDEV118 Media Queries
Upcoming SlideShare
Loading in...5
×

Thanks for flagging this SlideShare!

Oops! An error has occurred.

×
Saving this for later? Get the SlideShare app to save on your phone or tablet. Read anywhere, anytime – even offline.
Text the download link to your phone
Standard text messaging rates apply

WDEV118 Media Queries

185
views

Published on


0 Comments
0 Likes
Statistics
Notes
  • Be the first to comment

  • Be the first to like this

No Downloads
Views
Total Views
185
On Slideshare
0
From Embeds
0
Number of Embeds
0
Actions
Shares
0
Downloads
1
Comments
0
Likes
0
Embeds 0
No embeds

Report content
Flagged as inappropriate Flag as inappropriate
Flag as inappropriate

Select your reason for flagging this presentation as inappropriate.

Cancel
No notes for slide

Transcript

  • 1. WDEV118Media Queries for Standard Devices about.me/babon
  • 2. Smartphones (portrait & landscape)@media only screenand (min-device-width: 320px)and (max-device-width: 480px) { /* Styles */} about.me/babon
  • 3. Smartphones (landscape)@media only screenand (min-width: 321px) { /* Styles */} about.me/babon
  • 4. Smartphones (portrait)@media only screenand (max-width: 320px) { /* Styles */} about.me/babon
  • 5. iPads (portrait and landscape)@media only screenand (min-device-width: 768px)and (max-device-width: 1024px) { /* Styles */} about.me/babon
  • 6. iPads (landscape)@media only screenand (min-device-width: 768px)and (max-device-width: 1024px)and (orientation : landscape) { /* Styles */} about.me/babon
  • 7. iPads (portrait)@media only screenand (min-device-width: 768px)and (max-device-width: 1024px)and (orientation : portrait) { /* Styles */} about.me/babon
  • 8. Desktops and Laptops@media only screenand (min-width: 1224px) { /* Styles */} about.me/babon
  • 9. Large Screens@media only screenand (min-width: 1824px) { /* Styles */} about.me/babon
  • 10. iPhone 4@mediaonly screen and (-webkit-min-device-pixel-ratio: 1.5),only screen and (min-device-pixel-ratio : 1.5) { /* Styles */} about.me/babon
  • 11. SupplementalSource: CSS TricksDownload Template about.me/babon