background preloader

CSS Tools: Reset CSS

CSS Tools: Reset CSS

http://meyerweb.com/eric/tools/css/reset/

Related:  Outils utiles

La technique du Reset CSS Le reset CSS est une technique qui consiste à réinitialiser à 0 la valeur de certains éléments HTML afin d'éviter une partie des différences d'affichage sur les divers navigateurs. Avant d'aller plus loin, rappelons que l'usage de cette technique est controversé. Si vous souhaitez l'utiliser, il est recommandé d'utiliser un Reset CSS évolué, comme celui proposé par Eric Meyer, et d'éviter l'utilisation du sélecteur universel (*). Le Reset CSS classique (déconseillé) Créer un menu horizontal centré en CSS (sans JavaScript) - CSS / CSS3 Cet article a 3 années. Il commence à dater, lisez-le donc en gardant son âge en tête ! Merci Modèle de boite CSS Résumé Le modèle de boîte CSS définit les boîtes rectangulaires qui sont générées pour les éléments de la structure HTML. En CSS une boîte est constituée de 4 valeurs : margin les marges extérieures border les bordures padding les marges intérieures width le contenu Par défaut, la longueur totale du modèle de boîte et l’addition des valeurs du padding, des borders et de la propriété width.

Réaliser un lecteur vidéo HTML5 personnalisé Dans ce tutoriel nous allons voir comment réaliser un lecteur vidéo HTML5 personnalisé : voir la démonstration La balise HTML5 <video> permet la lecture de vidéos directement sans installation de plugins/codecs. La plupart des navigateurs propose un lecteur prédéfini mais il peut être intéressant de le personnaliser en fonction du design du site dans lequel on va l’intégrer. En effet il peut y avoir des différences de couleurs/formes suivant le navigateur utilisé comme montré ci-dessous : Rendus des lecteurs vidéos HTML5 par défaut sous Firefox, Chrome et Opera Formats vidéo

background-origin La propriété background-origin détermine la zone de positionnement de l'arrière-plan. Autrement dit, elle permet de définir la position de l'origine de l'image définie par la propriété background-image. Attention, background-origin est ignorée lorsque background-attachment vaut fixed. Note : Cette propriété est rattachée à la propriété raccourcie background. Aussi, si on a une déclaration background-origin avant la propriété raccourcie et que cette dernière ne définit pas la valeur de l'origine, ce sera la valeur initiale par défaut qui sera prise en compte pour background-origin. Syntaxe Une feuille de styles de base pour bien démarrer vos projets Avec cette astuce, je vous propose un outil et une méthodologie pour partir du bon pied lorsque vous attaquez les styles CSS d'un nouveau projet. Un outil? → une feuille de styles CSS qui corrige ou définit les styles des principaux éléments de vos pages. (Yay, du code à copier-coller!) Une méthodologie? → explorer ce code, se l'approprier, le modifier pour son projet.

Menu déroulant en CSS3 avec transition et max-height - CSS / CSS3 Menu déroulant en CSS3 avec transition et max-height Cet article a 3 années. Il commence à dater, lisez-le donc en gardant son âge en tête ! Merci 12 nouvelles ressources jQuery et CSS Quoi de mieux pour booster votre esprit créatif web que de bons plug-ins utiles pour vos futures créations ? Webdesigner Trends vous propose 12 ressources récemment sélectionnées sur le web. C’est parti ! Pour cette sélection, j’ai décidé de ne pas m’arrêter à une utilisation précise. Templates mail responsive 100% compatible clients mails mobiles De nos jours, de plus en plus d'emails sont lus sur les terminaux mobiles. Avec une évolution de la lecture sur mobile aussi marquée , les campagnes d'e-mailing se doivent d'être compatibles avec le plus grand nombre de terminaux. Le studio Zurb l’a bien compris et a donc décidé de réaliser une série de 5 templates mail responsive. Les fêtes de fin d’année approchant, ils sont disponibles en téléchargement gratuit sur le Zurb’s playground. Fonctionnement d’un template mail responsive

HTML XHTML -Les tableaux Présentation des balises La balise <table> permet de créer un tableau. Il faudra utiliser la balise <tr> pour créer une nouvelle ligne dans le tableau. Entre les balises <tr> et </tr> nous mettrons nos cellules grâce aux balises <td>. Entre les balises <td> et </td> nous mettrons le contenu de la case (texte, image...). La balise <td> peut être remplacée par <th> si la case est un intitulé de colonne.

Box-shadow generator Cet outil permet de contruire des effets CSS de type box-shadow effects, pour ajouter des effets d'ombrage à vos objets CSS. box-shadow generator HTML Content CSS Content JavaScript Content

Related:  CSS