La balise <details>

La balise <details> affiche à la demande des précisions sur un texte. Elle fonctionne avec Google Chrome, mais elle a besoin d’un script pour être prise en compte dans Firefox. Le script à insérer 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 <script> $(document).ready(function() { if (!('open' in document.createElement('details'))) { $("details").each(function() { $(this).find("summary").show().click(function() { $(this).siblings().toggle(); $(this).parent('details').toggleClass('open'); }); var opened = $(this).

La propriété « background »

La propriété background est un raccourci qui définit les différentes valeurs des propriétés liées à la gestion des arrière-plans d’un élément. Un fond d’écran extensible Les marges sont mises à zéro, l’image (image.png) est appelée, centrée et couvrira l’écran. Le css 1 2 3 4 5 6 7 html { margin:0; padding:0; background: url(image.png) no-repeat center fixed; -webkit-background-size: cover; /* pour anciens Chrome et Safari */ background-size: cover; /* version standardisée */ } Désormais, ce background s’adapte à la taille de l’écran.

Screenfly

Afin de savoir si votre site est vraiment « responsive », vous pouvez tester l’affichage sur différentes résolutions d’écran. Un utilitaire est disponible en ligne : Screenfly. Rendez-vous sur ScreenFly. Saisissez simplement l’URL de votre site et cliquez sur Go puis sélectionnez l’appareil concerné dans le menu en haut. À votre disposition, le rendu sur des écrans d’ordinateurs, des tablettes, des téléphones ou des téléviseurs. Vous pouvez également choisir une résolution spécifique (Custom Screen Size) ou faire une rotation d’écran.