background preloader

Tuto-Web

Facebook Twitter

30 New Free High-Quality Fonts - Smashing Magazine. Advertisement Every now and then we look around, select fresh high-quality free fonts and present them to you in a brief overview.

30 New Free High-Quality Fonts - Smashing Magazine

The choice is enormous, so the time you need to find them is usually time you should be investing in your current projects. We search for them and find them so that you don’t have to. In this selection, we’re pleased to present Piron, Nobile, St Marie, Code, Arcus, Crimson Text, Quadranta, Juice, Prociono, Mr Jones, Ibarra Real and various useful symbol fonts. Please note that some fonts are for personal use only and are clearly marked as such.

New Free High-Quality Fonts Piron1 Piron is a highly legible typeface, very well suited to any display or text usage: Web, print (especially magazines), brochures, logos, posters, flyers, motion graphics. St Ryde Regular2 (Registration required, PDF Specimen3) St Ryde is a sans-serif, very casual typeface, that works perfect in your bodycopy within the regular weights. 01.BASE42 This free font is bold and experimental. Les Media Queries CSS3 - Alsacréations. La spécification CSS3 Media Queries définit les techniques pour l'application de feuilles de styles en fonction des périphériques de consultation utilisés pour du HTML.

Les Media Queries CSS3 - Alsacréations

On nomme également cette pratique Responsive Web Design, pour dénoter qu'il s'agit d'adapter dynamiquement le design à l'aide de CSS. Ces bonnes pratiques permettent d'exploiter encore plus les avantages de la séparation du contenu et de la présentation : l'intérêt est de pouvoir satisfaire des contraintes de dimensions, de résolutions et d'autres critères variés pour améliorer l'apparence graphique et la lisibilité (voire l'utilisabilité) d'un site web. Les plateformes exotiques sont concernées en premier lieu : navigateurs mobiles et tablettes, écrans à faibles résolutions, impression, tv, synthèses vocales, plages braille, etc. Approche historique Avec CSS2 et HTML4, il était déjà possible de spécifier un média de destination pour l'application d'une ou plusieurs feuilles de style. <! Screen Écrans handheld print. Extraits du livre CSS avancées, vers HTML5 et CSS3.

Ombres avancées avec CSS3 et box-shadow - Les tutoriels. CSS3 c’est pour l’aspect vendeur du nom, car au final on va aussi et surtout bénéficier du service de pseudo éléments (:after et :before) qui sont prévus depuis CSS2.1.

Ombres avancées avec CSS3 et box-shadow - Les tutoriels

Les visuels que vous voyez sur la page de démonstration ne sont composés qu’avec des propriétés CSS sur une seule et unique <div> (pour chaque bloc). Chez moi le meilleur rendu est sous Firefox, notamment pour la dernière ombre qui est un peu osée (au passage il semblerait que la propriété opacity ne fonctionne pas sur les pseudo-éléments). Dans cette démonstration nous allons utiliser des propriétés avancées de CSS2.1 (:before et :after) qui sont des pseudo-éléments.

Des pseudo-éléments permettent de construire un élément dans la structure de votre document (DOM) sans vraiment en construire un… ok, ça commence bien pour l’explication. Pseudo-éléments :after et :before Ainsi tous les liens porteurs de l’attribut hreflang se verront agrémentés d’un « (en) », dans le cas d’un lien anglais par exemple :Mon lien (en) Bogues. Ressources Web.