davidbgk
/
larlet-fr-david
Sledovat 1
Oblíbit 0
Rozštěpit 0
Zdrojový kód Vydání 0 Aktivita
Repository with sources and generator of https://larlet.fr/david/ https://larlet.fr/david/
Nelze vybrat více než 25 témat Téma musí začínat písmenem nebo číslem, může obsahovat pomlčky („-“) a může být dlouhé až 35 znaků.
253 Revize
1 Větev
Strom: 7507cd4898
Větve Značky
${ item.name }
Vytvořit větev ${ searchTerm }
z „7507cd4898“
${ noResults }
larlet-fr-david/david/stream/2018/04/12/index.md

index.md 1.2KB
Surový Normal View Historie

Add initial content
před 4 roky
​
​
​
​
​
​
​
​
​
​
​
​
​
​
 123456789101112131415 
  1. title: Graded browser support

  2. lang: en

  3. 

  4. > We load a basic stylesheet to all users. This contains only [normalisation](https://necolas.github.io/normalize.css/) and a few small enhancements to the user-agent stylesheet.

  5. > To load the full experience only in modern browsers (grade-A and grade-X) we implement logic in the media attribute of the `<link>` element that identifies the main stylesheet, loading the stylesheet only in browsers that recognise the properties of that media query.

  6. > This technique is documented here: [Cutting the Mustard with Media queries](https://www.sitepoint.com/cutting-the-mustard-with-css-media-queries/).

  7. >

  8. > […]

  9. > 

  10. > We couple the loading of JavaScript to the loading of the enhanced CSS.

  11. > If the browser loads the CSS within the media query, then load the JavaScript.

  12. >

  13. > <cite>*[Graded browser support](https://github.com/springernature/frontend-playbook/blob/master/practices/graded-browser-support.md)* ([cache](/david/cache/85aca7f1c273ca304c3e546a24334f33/))</cite>

  14. 

  15. Very clever technique for Progressive Enhancement that I discovered *via* this [fantastic talk transcript](https://sonniesedge.co.uk/talks/dear-developer) ([cache](/david/cache/c29715f16da9411c6550c25b7b99c418/)). Go read the whole piece, the Web deserves it.