Cours Css Uahb

css Cascading Style Sheets M Kara Généralités CSS, cela signifie « Cascading Style Sheets ce qui se traduit en français par feuilles de style en cascade. La feuille de style fournit la mise en forme des éléments de la page, qui auront été écrits en HTML. Elle s’applique à une ou plusieurs pages du site. Le terme « en cascad page peut faire appel org différentes propriété ffe- alors pour lui donner Lorsque deux propri s’appliquent et c’est g pris en compte. Principes de base pour une page web n forme d’une tyle. Les lément s’ajoutent règles de priorité ralement le dernier style défini qui est Voici les principales qualités demandées à une page web : Qu’elle soit claire dans sa conception, Accessible à tous et que son esthétique s’accorde bien avec son contenu. Choix sensé des balises HTML En HTML, chaque élément doit être porteur de sens. Par exemple : mots-clés essentiels ; L’accessibilité sera améliorée pour les personnes en situation de handicap.

Adaptation aux navgateurs: Mozilla, internet explorer, etc. 4 Polices de caractères Titre de page: Mise en gras ou en italique: il existait en HTML les balises (gras) et (Italique) qui ont obsolètes en XHTML : remplacez-les respectivement par estrong> et Liste de liens hypertexte pour les (menu): cul> Fermeture des balises simples En XHTML toutes les balises doivent être fermées, y compris celles qui, n’entourant pas de contenu, ne s’écrivent pas par paires.

Leur barre de fermeture est alors intégrée dans la balise ellemême : Saut de ligne: /> au lieu de Tracé d’une ligne horizontale : chr au lieu de Image: au lieu de ) possèdent des marges intérieures (padding) et extérieures (margin) par défaut, qu’il faut préciser ou ettre à zéro dans la feuille de style. Balise meta et codage en utf-8 Si ce codage est correctement déclaré, il sera possible de taper directement lettres accent ç et symbole euro€, sans charset=utf-8″ 7 Définition d’une règle de style Voici comment sélectionner un élément de la page et lui attribuer une propriété de mise en forme. Principe LJne règle de style comprend : • un sélecteur : il s’agit des balises concernées par cette règle ; • un bloc de déclarations : il indique les propriétés ? attribuer à ces balises. Chaque déclaration est du type : propriété : valeur;

Exemple de règle de style La règle de la figure indique que les titres de niveau 3 (encadrés par s’afficheront en italique et en Arial (ou dans une police générique sans-serif si la police Arial est absente). 8 Emplacement des styles Les règles de style peuvent se trouver • dans le code HTML, comme attributs de balises : ce sont des styles en ligne (utilisation déconseillée – voir plus loin) ; • dans l’en-tête de la page web : feuille de style interne ; • ou dans un fichier distinct : feuille de style externe, à appeler dans l’en-tête de la page web.

Feuille de style interne Lorsque les règles de styles sont regroupées dans Yen-tête de la page web, elles constituent une feuille de style interne. Les styles sont écrits entre les balises et ? l’intérieur dune balise règles de styles sont placées ? l’intérieur de balises de commentaires HTML 10 Feuille de style externe Lorsque des règles de styles sont applicables à plusieurs pages web, il est intéressant de les écrire dans un fichier à part.

Cette feuille de style externe est appelée par hacune des pages concernées. Elle garantit runité graphique du site et facilite les modifications. Une feuille de style externe est un fichier d’extension • C’est un fichier texte qui contient l’ensemble des règles définies. • Il ne contient pas les balises • I ny a pas non plus les symboles de commentaires 12 Pour que cette feuille de style soit prise en compte dans une page web, il suffit de l’appeler dans l’en-tête, en utilisant une des deux méthodes suivantes (dans l’exemple qui suit, la feuille de style s’appelle mon_style. ss et se trouve dans le même dossier ue la age web) : ersion Netscape 4, qui n’est pas aux normes CSS et interprète mal les styles : mieux vaut lui laisser ignorer ces styles et afficher le texte brut, au moins restera lisible. 14 Styles en ligne Dans le corps de la page HTML (entre et ), il est possible de préciser des styles qui prévaudront sur ceux précédemment déclarés dans la feuille de style. Exemple d’un titre de niveau 2 qui doit être centré et écrit en rouge .

Il suffit de leur attribuer une classe commune, par exemple

Voici une pape XHTML sim PAGF3CFq des Samb 24 Page