Écrire une page web utilisant ubn fond composé de :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<title>Page de présentation dla superosition de différents styles de fonds</title>
<!-- style1 utilisation de style et modification des paramètres -->
<style type="text/css">
body {color:#FFF;
background-color:#784;
background-image:url(tux.png),url(feuilles.png);
background-repeat:no-repeat, repeat;
background-size:auto 60%,auto;
background-position:center 0,0 0;
background-attachment:fixed,scroll;
font-size:25px}
h1 {color:#80F;}
</style>
</head>
<body>
<h1>test d'affectation de fonds en CSS3</h1>
<h2>Les feuilles mortes</h2>
<p><q>Les Feuilles</q> mortes est une chanson composée par Jacques Prévert pour le texte et Joseph Kosma pour la musique.</p>
<p>Née en 1945 d'une musique de ballet (Le Rendez-vous) écrite par Kosma, sur laquelle Prévert a écrit un texte
qu'il disait être « simple comme bonjour. »</p>
<p>La chanson devait initialement être le générique de Les Portes de la nuit, film contrarié de Marcel Carné / Prévert.
Pourtant, ce n'est pas Yves Montand qui a créé cette chanson qu'il interprète effectivement dans ce film. Il est vrai
qu'il l'a lui-même prétendu, alors qu'il ne l'a en réalité pas toujours eu à son répertoire : « Il a manqué d'élégance »,
concédait Cora Vaucaire en 1995, cédant à la curiosité d'Alain Poulanges (entretien sur France Inter). Car c'est bien
Cora Vaucaire qui la première a enregistré ce titre et, à peu près en même temps, Marianne Oswald, qui en donne une
superbe version, partiellement en allemand. Jacques Douai en fut le premier interprète masculin en 1947.</p>
<p>Cora Vaucaire, habituée à défendre Prévert sur scène, a longuement bataillé pour imposer cette chanson sans
couplet / refrain et à laquelle « manque un pied », remarquaient certains à l'époque... une chanson pour tout dire
trop subtile pour « un public de cons », expliqua-t-on à Cora Vaucaire, un soir, à l'Échelle de Jacob !</p>
<p>On connaît depuis le destin qu'a connu cette chanson, de ses interprètes francophones (Jean Sablon,
Jacqueline François...), à sa version anglaise Autumn Leaves, adaptée par Johnny Mercer en 1949, qui a eu tout
autant de succès, devenant un standard du jazz. Frankie Veloz l'a repris en salsa et il existe une version disco
interprétée par Grace Jones. On dénombre à ce jour plus de 600 interprétations différentes... mais pas Marlene Dietrich,
qui avait refusé de jouer dans Les Portes de la nuit après sa rupture avec Jean Gabin... Une anecdote prétend que Jacques
Prévert, rancunier, s'y opposa.</p>
<p>Notons enfin qu'Yves Montand qui rencontrait pourtant un grand succès dans le monde anglo-saxon, s'est toujours refusé
à chanter Les Feuilles mortes en anglais. Quant à Cora Vaucaire, elle livrait encore une stupéfiante interprétation
piano - violoncelle, aux Bouffes du Nord de Paris... en 1999 !</p>
<p>Serge Gainsbourg lui rend hommage dans La Chanson de Prévert.</p>
<cite>Ce texte provient de <a href="http://fr.wikipedia.org/wiki/Les_Feuilles_mortes">Wikipedia</a>.</cite>
<p><a href="http://validator.w3.org/check?uri=referer">page xHTML valide</a> et <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS valide</a></p>
</body>
</html>
Dans cet exercice :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<title>Page de présentation de la superposition de différents styles de fonds</title>
<!-- style1 utilisation de style et modification des paramètres -->
<style type="text/css">
html {
text-shadow:0 0 0.1em #FFF;
}
body {
color:#FFF;
background-color:#784;
background-image:url(tux.svg);
background-repeat:no-repeat;
background-size:100%;
background-position:center center,;
background-attachment:fixed;
font-size:25px;
}
h1 {color:#80F;}
article {
margin:2em;
color:#004;
background-color:#F00;
background-image:url(tux.svg);
background-repeat:no-repeat;
background-size:30%;
background-position:center center;
background-attachment:scroll;
opacity:0.5;
}
section {
background-color:hsla(10, 50%, 60%, 0.8);
}
h1 {color:#80F;}
</style>
</head>
<body>
<h1>test d'affectation de fonds en CSS3</h1>
<section>
<h2>Molière</h2>
<article>
<p>Jean-Baptiste Poquelin, dit Molière, né à Paris, baptisé le 15 janvier 1622 et mort à Paris le 17 février 1673,
est un dramaturge auteur de comédies, mais aussi un comédien et chef de troupe de théâtre français qui s'est illustré
au début du règne de Louis XIV.</p>
<p>Issu d'une famille de petite bourgeoisie parisienne (son père occupe la charge de <q>tapissier du Roi</q>),
Jean-Baptiste Poquelin fait des études dans un collège de Jésuites réputé jusqu'en 1639 puis commence des études
de droit à Orléans. Il les abandonne en 1642, pour se consacrer au théâtre après la rencontre de Madeleine et Joseph
Béjart avec qui il fonde <q>l'Illustre Théâtre</q> et prend le pseudonyme de Molière. Après la faillite, il quitte
Paris et parcourt les différentes provinces de 1645 à 1658 en écrivant ses premières farces
(L'Étourdi – Le dépit amoureux).</p>
<p>De retour à Paris en 1658, il obtient la protection du frère du roi : sa troupe prend le nom de <q>Troupe de
Monsieur</q> et représente en particulier les tragédies de Pierre Corneille (Nicomède – Cinna).
Sa carrière d'auteur dramatique commence vraiment avec Les Précieuses ridicules qui remporte un grand succès en
novembre 1659. Soutenu par le roi Louis XIV, (mal)marié avec Armande Béjart et vite malade du poumon, Molière
affronte les cabales et continue à jouer et à diriger sa troupe – devenue <q>Troupe du Roy</q> - tout en écrivant des
comédies de genres variés (des comédies proches de la farce comme Le médecin malgré lui (1666) ou Les Fourberies
de Scapin (1671), des comédies plus psychologiques comme L'École des femmes (1662) ou L'Avare (1668), des
comédies-ballets comme Le Bourgeois gentilhomme en 1670 (avec Lully) ou Le malade imaginaire (avec Marc-Antoine
Charpentier) en 1673, des pièces plus élaborées approfondissant caractère et étude sociale, en vers comme Le
Misanthrope (1665), Tartuffe (1664-1669), Les Femmes savantes (1672), ou en prose comme Dom Juan (1665).</p>
<p>Peintre des mœurs de son temps, surtout de la bourgeoisie dont il dénonce les travers(prétention nobiliaire,
place des femmes, mariage d'intérêt...), Molière a créé en même temps des personnages individualisés emblématiques
et approfondis dont la liste est longue : Monsieur Jourdain, Harpagon, Alceste et Célimène, Orgon et Tartuffe, Dom Juan
et son valet Sganarelle, Argan le malade imaginaire...</p>
<p>L'invention dramatique de Molière est assez limitée puisqu'il reprend Plaute (L'Avare), les fabliaux (Le médecin
malgré lui), les auteurs espagnols et italiens (Dom Juan) et des thèmes traitées par d'autres à son époque. Mais son
œuvre écrite sur 15 ans montre à la fois une grande variété et une grande vérité humaine en même temps qu'une maîtrise
efficace du jeu scénique et du texte de théâtre qui révèle l'homme de scène qu'il était avant tout puisqu'il a
continué à jouer malgré la maladie jusqu'à son dernier jour survenu à 51 ans, le 17 février 1673.</p>
<p>Molière demeure depuis le XVIIe siècle l'un des tous premiers auteurs de comédies de la littérature française, chaque
époque trouvant en lui des thématiques modernes. Il constitue aussi un des piliers de l'enseignement littéraire
en France.</p>
</article>
<cite>Ce texte provient de <a href="http://fr.wikipedia.org/wiki/Les_Feuilles_mortes">Wikipedia</a>.</cite>
</section>
<p><a href="http://validator.w3.org/check?uri=referer">page xHTML valide</a> et <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS valide</a></p>
</body>
</html>
Dans cet exercice :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd"> <html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr"> <head> <meta http-equiv="Content-type" content="text/html; charset=UTF-8" /> <title>Page de présentation dla superosition de différents styles de fonds</title> <!-- style1 utilisation de style et modification des paramètres --> <style type="text/css"> h1 { text-align:center; margin:1em 20%; padding:1em; font-size:200%; border-radius:2em; background-image:-webkit-linear-gradient(45deg, #F00 10%, #FF0 90%); background-image:-moz-linear-gradient(45deg, #F00 10%, #FF0 90%); background-image:-ms-linear-gradient(45deg, #FF4 40%, #F44 60%); background-image:-o-linear-gradient(45deg, #F00 0%, #FF0 100%); background-image:linear-gradient(45deg, #FF4 40%, #F44 60%); } body { font-size:150%; background-repeat:no-repeat,no-repeat,no-repeat; background-image: url(tux.svg), -webkit-gradient(linear, center top, center bottom, color-stop(0,rgba(10%,10%,100%, 0)), color-stop(20%,rgba(10%,10%,100%, 1))), -webkit-gradient(radial, 50% 70%, 200, 50% 70%, 250, from(rgba(100%,100%,25%, 1)), to(#F44)); background-image: url(tux.svg), -o-linear-gradient(270deg, rgba(10%,10%,100%,0) 0%, rgba(10%,10%,100%,1) 20%), -o-radial-gradient(50% 70%, circle, rgba(100%,100%,25%,1) 25%, rgba(100%,25%,25%,1) 30%); background-image: url(tux.svg), -moz-linear-gradient(270deg, rgba(10%,10%,100%,0) 0%, rgba(10%,10%,100%,1) 20%), -moz-radial-gradient(50% 70%, circle, rgba(100%,100%,25%,1) 25%, rgba(100%,25%,25%,1) 30%); background-image: url(tux.svg), linear-gradient(270deg, rgba(10%,10%,100%,0) 0%, rgba(50%,50%,100%,1) 20%), radial-gradient(50% 70%, circle, rgba(100%,100%,25%,1) 25%, rgba(100%,25%,25%,1) 30%); background-size:10% auto, 100% 20%,100%; background-position: 5% 10%,80% 100%,center; background-color:rgb(10%,10%,100%); color:#FFF; text-shadow:0 0 0.1em #000; } div { background-repeat:no-repeat; background-size:40% 100%; background-position: bottom right; background-color:transparent; background-image:radial-gradient(100% 100%, circle, rgba(100%,0%,0%,0) 20%, rgba(100%,100%,0%,1) 24%, rgba(0%,100%,0%,1) 28%, rgba(0%,100%,100%,1) 32%, rgba(0%,0%,100%,1) 36%, rgba(100%,0%,100%,0) 40%); background-image:-o-radial-gradient(100% 100%, circle, rgba(100%,0%,0%,0) 20%, rgba(100%,100%,0%,1) 24%, rgba(0%,100%,0%,1) 28%, rgba(0%,100%,100%,1) 32%, rgba(0%,0%,100%,1) 36%, rgba(100%,0%,100%,0) 40%); background-image:-ms-radial-gradient(100% 100%, circle, rgba(100%,0%,0%,0) 20%, rgba(100%,100%,0%,1) 24%, rgba(0%,100%,0%,1) 28%, rgba(0%,100%,100%,1) 32%, rgba(0%,0%,100%,1) 36%, rgba(100%,0%,100%,0) 40%); background-image:-moz-radial-gradient(100% 100%, circle, rgba(100%,0%,0%,0) 20%, rgba(100%,100%,0%,1) 24%, rgba(0%,100%,0%,1) 28%, rgba(0%,100%,100%,1) 32%, rgba(0%,0%,100%,1) 36%, rgba(100%,0%,100%,0) 40%); background-image:-webkit-radial-gradient(100% 100%, circle, rgba(100%,0%,0%,0) 20%, rgba(100%,100%,0%,1) 24%, rgba(0%,100%,0%,1) 28%, rgba(0%,100%,100%,1) 32%, rgba(0%,0%,100%,1) 36%, rgba(100%,0%,100%,0) 40%); } a {color:#FF0} a:visited {color:#CCC} a:hover {color:#F80} ::selection {color:red;background-color:#FF0} </style> </head> <body> <h1>test des gradients</h1> <div> <h2>Molière</h2> <p>Jean-Baptiste Poquelin, dit Molière, né à Paris, baptisé le 15 janvier 1622 et mort à Paris le 17 février 1673, est un dramaturge auteur de comédies, mais aussi un comédien et chef de troupe de théâtre français qui s'est illustré au début du règne de Louis XIV.</p> <p>Issu d'une famille de petite bourgeoisie parisienne (son père occupe la charge de <q>tapissier du Roi</q>), Jean-Baptiste Poquelin fait des études dans un collège de Jésuites réputé jusqu'en 1639 puis commence des études de droit à Orléans. Il les abandonne en 1642, pour se consacrer au théâtre après la rencontre de Madeleine et Joseph Béjart avec qui il fonde <q>l'Illustre Théâtre</q> et prend le pseudonyme de Molière. Après la faillite, il quitte Paris et parcourt les différentes provinces de 1645 à 1658 en écrivant ses premières farces (L'Étourdi – Le dépit amoureux).</p> </div> <cite>Ce texte provient de <a href="http://fr.wikipedia.org/wiki/Les_Feuilles_mortes">Wikipedia</a>.</cite> <p><a href="http://validator.w3.org/check?uri=referer">page xHTML valide</a> et <a href="http://jigsaw.w3.org/css-validator/check/referer">CSS valide</a></p> </body> </html>
Dans cet exercice :
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.1//EN" "http://www.w3.org/TR/xhtml11/DTD/xhtml11.dtd">
<html xmlns="http://www.w3.org/1999/xhtml" xml:lang="fr">
<head>
<meta http-equiv="Content-type" content="text/html; charset=UTF-8" />
<title>Page de présentation de la superposition de différents styles de fonds</title>
<style type="text/css">
body {
color:#FFF;
background-color:#555;
padding:1em;
text-shadow:0.1em 0.1em 0.1em #000;
}
article {
margin:2em;
padding:1em;
background-image:url("tux2.svg");
background-repeat:no-repeat;
background-size:auto 100%;
background-position:0 0;
background-color:#466;
background-origin:border-box;
border:1em dotted #F80;
}
article+article {
background-clip:padding-box;
background-origin:padding-box;
background-color:#464;
}
article+article+article {
background-clip:content-box;
background-origin:content-box;
background-color:#646;
}
</style>
</head>
<body>
<h1>test de <samp>background-clip</samp></h1>
<h2>Erik le Rouge</h2>
<article>
<h3>Portrait d'Erik le Rouge tiré de la Gronlandia d'Arngrímur Jónsson (1688).</h3>
<p>Erik le Rouge (en norrois Eiríkr Rauði) (circum 950 à 1003 ou circum 940 à 1010)
est un explorateur norvégien. Son vrai nom est Eirikr Thorvaldson (Eiríkr Þorvaldsson),
mais ses contemporains le surnomment <q>Le Rouge</q> en raison de la couleur rousse de
ses cheveux et de sa barbe. Il est resté dans l'histoire pour avoir fondé la première
colonie européenne au Groenland, qui fut narré plus tard dans la Saga d'Erik le Rouge.
Son fils, Leif Ericson découvrit et installa une colonie sur les terres encore plus à
l'ouest du Vinland, que l'on pense être située sur l'actuelle Terre-Neuve.</p>
</article>
<article>
<h3>Histoire</h3>
<p>Þorvaldr Ásvaldsson, le père d'Eiríkr Rauði, est banni de Norvège à la suite d’un
meurtre, il s’installe au nord-ouest de l'Islande vers l'an 970. Eiríkr est à son tour
banni d'Islande pour un meurtre ; il part alors pour des terres que seuls quelques
Européens avaient déjà vu avant lui, et notamment Gunnbjörn Ulfsson, le premier à les
avoir découvertes entre 876 et 932. Erickr appela cette terre qui connaissait un climat
plus favorable au début du deuxième millénaire, Groenland (Grønland en danois <q>terre verte</q>)
dans le but d'y attirer les plus de colons possible. Il s'installe autour de l’actuelle
ville de Qaqortoq. De retour en Islande après les trois années d'exil qu'il passe à explorer
la côte orientale du Groenland, il prépare la colonisation des terres qu'il a découvertes.</p>
<p>Parti entre 985 et 988 avec une flotte d'une trentaine de <q>knörir</q>, les bateaux viking
d'époque, il s'installe à Eystribyggð entre le cap Farewell et le cercle polaire. Les premiers
colons sont au nombre de 450. Plus tard, leur nombre s’élève peut-être à 5000, répartis en deux
établissements situés tous deux au fond de fjords de la côte sud-ouest (appelés Eystribyggð :
établissement de l'est et Vestribyggð : établissement de l'ouest ; sur les emplacements des villes
actuelles de Nuuk et Qaqortoq). Eiríkr reste païen, mais sa femme Þjóðhildr (Thiodhild) se convertit
au christianisme en même temps que la colonie devenait elle-même chrétienne ; elle fait construire
une église dont il subsiste encore des vestiges. Les colons s'organisent politiquement sur le modèle
islandais et Erickr devient le chef suprême du Groenland, riche et respecté. Il y demeure jusqu'à sa
mort à la suite d'une épidémie, vers l'an 1010, mais les derniers colons scandinaves, victimes d'un
refroidissement du climat, des luttes avec les inuits ou de la famine, disparurent du Groenland vers
la fin du XIVe siècle.</p>
</article>
<article>
<h3>Descendance</h3>
<p>La tradition médiévale islandaise raconte qu'Eiríkr eut quatre enfants dont trois fils : Leifr (Leif),
Þorvald (Thorvald) et Þorsteinn (Thorsteinn) et une fille : Freydís. Elle était la fille d'une seconde
épouse. Selon la tradition scandinave, Leifrs serait le second européen à découvrir les terres de ce
qu'il appellera le Vinland (certainement Terre Neuve) ; une trentaine d'années après Bjarni Herjólfsson
qui ne fit apparemment que les apercevoir. Leif invita son père à le rejoindre au Vinland après y avoir
établi une colonie, mais Erikr ne le suivit pas.</p>
</article>
<p><cite>Ce texte provient de <a href="http://fr.wikipedia.org/wiki/Les_Feuilles_mortes">Wikipedia</a>.</cite></p>
<p><a href="http://validator.w3.org/check?uri=referer">page xHTML valide</a> et
<a href="http://jigsaw.w3.org/css-validator/check/referer">CSS valide</a></p>
</body>
</html>