Forked from dpschen/font-smoothing-on-high-dpi-media.css
Created
May 8, 2018 15:28
-
-
Save zhaiduo/ad104ea5e9ebe3d109a74d518037bdc8 to your computer and use it in GitHub Desktop.
Use more beautiful font smoothing on high dpi media devices
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
/* ---------------------------------------------------------- */ | |
/* */ | |
/* A media query that captures: */ | |
/* */ | |
/* - Retina iOS devices */ | |
/* - Retina Macs running Safari */ | |
/* - High DPI Windows PCs running IE 8 and above */ | |
/* - Low DPI Windows PCs running IE, zoomed in */ | |
/* - Low DPI Windows PCs and Macs running Firefox, zoomed in */ | |
/* - Android hdpi devices and above */ | |
/* - Android tvdpi devices, including Google Nexus 7 */ | |
/* - Chrome running on high DPI Macs and PCs */ | |
/* - Opera running on high DPI Macs, PCs and mobile devices */ | |
/* */ | |
/* Please note that that this code assumes you'll swap a */ | |
/* 2× version of your images. If you'd like to supply */ | |
/* finer increments, other thresholds might be appropriate. */ | |
/* */ | |
/* A test for CSS pixel densites can be found here: */ | |
/* http://bjango.com/articles/min-device-pixel-ratio/ */ | |
/* */ | |
/* @marcedwards from @bjango */ | |
/* */ | |
/* ---------------------------------------------------------- */ | |
@media only screen and (-webkit-min-device-pixel-ratio: 1.3), | |
only screen and (-o-min-device-pixel-ratio: 13/10), | |
only screen and (min-resolution: 120dpi) { | |
/* Usually one should use this on dark background only | |
http://usabilitypost.com/2012/11/05/stop-fixing-font-smoothing/ | |
But: because we have enough pixels here (retina!) it shouldn't be a problem. | |
It just renders more beautiful */ | |
-moz-osx-font-smoothing: grayscale; | |
-webkit-font-smoothing: antialiased; | |
} |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment