{"id":15,"date":"2023-12-21T21:06:26","date_gmt":"2023-12-21T21:06:26","guid":{"rendered":"https:\/\/yzaz.net\/html\/?page_id=15"},"modified":"2024-11-03T10:00:04","modified_gmt":"2024-11-03T10:00:04","slug":"intro-css","status":"publish","type":"page","link":"https:\/\/yzaz.net\/html\/intro-css\/","title":{"rendered":"Introduction au CSS"},"content":{"rendered":"

Les feuilles de style en cascade CSS “Cascading Style Sheets”
\n(CSS) est un outil pour la pr\u00e9sentation des sites Web. Elles peuvent faire gagner beaucoup de temps, et elles permettent de cr\u00e9er des sites Web de fa\u00e7on enti\u00e8rement nouvelle.
\nL’utilisation de CSS n\u00e9cessite une connaissance de base de HTML.<\/p>\n

La syntaxe CSS de base<\/h3>\n

Exp: le fond d’une page Web bleue:
\nAvec HTML\u00a0:<\/strong><\/h3>\n
\r\n<body bgcolor="#FF0000"> \r\n<\/pre>\n
Avec CSS\u00a0:<\/strong><\/p>\n
\r\nbody {background-color: #0000FF;}\r\n<\/pre>\n
\"\"<\/a><\/p>\n
Appliquer CSS \u00e0 un document HTML
\nIl  existe 3 fa\u00e7ons
\nM\u00e9thode 1 : Dans la ligne (l’attribut style)
\nAvec l’attribut HTML style.
\nExp\u00a0:<\/p>\n
\r\n<html> \r\n<head> \r\n      <title>mon titre<\/title> \r\n<\/head> \r\n<body style="background-color: #0000FF;">\r\n    <p>Cette page est blue<\/p> \r\n<\/body> \r\n<\/html> \r\n<\/pre>\n
M\u00e9thode 2 : Interne (l’\u00e9l\u00e9ment style)
\nUne autre m\u00e9thode consiste \u00e0 inclure le code CSS avec la balise HTML <style><\/strong>.
\n Exp:<\/p>\n
\r\n<html> \r\n<head>\r\n <title>mon titre<\/title>\r\n <style type="text\/css"> \r\n     body {background-color: #0000FF;} \r\n <\/style> \r\n<\/head> \r\n<body> \r\n<p>Cette page est blue<\/p> \r\n<\/body>\r\n <\/html>\r\n<\/pre>\n
M\u00e9thode 3 : Externe (un lien vers une feuille de style)
\nLa m\u00e9thode recommand\u00e9e est celle avec un lien vers feuille de style externe.
\nUne feuille de style externe est un fichier texte ayant l’extension \u00ab\u00a0.css\u00a0\u00bb.
\nExp: votre feuille de style se nomme \u00ab\u00a0style.css\u00a0\u00bb et se trouve dans le m\u00eame dessier que la page html.
\nOn cr\u00e9e un lien depuis (ex1.html) vers la feuille de style (style.css). Ce lien peut \u00eatre cr\u00e9\u00e9 en une ligne de code HTML\u00a0:<\/p>\n
\r\n<link rel="stylesheet" href="style.css" \/> \r\n<\/pre>\n
La ligne de code doit \u00eatre ajout\u00e9 entre les balises <head><\/strong> et <\/head><\/strong>. <\/p>\n","protected":false},"excerpt":{"rendered":"
Les feuilles de style en cascade CSS “Cascading Style Sheets” (CSS) est un outil pour la pr\u00e9sentation des sites Web. Elles peuvent faire gagner beaucoup de temps, et elles permettent de cr\u00e9er des sites Web de fa\u00e7on enti\u00e8rement nouvelle. L’utilisation de CSS n\u00e9cessite une connaissance de base de HTML. La syntaxe CSS de base Exp: le fond d’une page Web<\/p>\n","protected":false},"author":1,"featured_media":0,"parent":0,"menu_order":20,"comment_status":"closed","ping_status":"closed","template":"","meta":{"footnotes":""},"_links":{"self":[{"href":"https:\/\/yzaz.net\/html\/wp-json\/wp\/v2\/pages\/15"}],"collection":[{"href":"https:\/\/yzaz.net\/html\/wp-json\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/yzaz.net\/html\/wp-json\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/yzaz.net\/html\/wp-json\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/yzaz.net\/html\/wp-json\/wp\/v2\/comments?post=15"}],"version-history":[{"count":1,"href":"https:\/\/yzaz.net\/html\/wp-json\/wp\/v2\/pages\/15\/revisions"}],"predecessor-version":[{"id":16,"href":"https:\/\/yzaz.net\/html\/wp-json\/wp\/v2\/pages\/15\/revisions\/16"}],"wp:attachment":[{"href":"https:\/\/yzaz.net\/html\/wp-json\/wp\/v2\/media?parent=15"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}