{"id":1013,"date":"2017-10-31T11:28:39","date_gmt":"2017-10-31T10:28:39","guid":{"rendered":"http:\/\/lamartinieredesign.fr\/?page_id=1013"},"modified":"2023-03-30T10:47:31","modified_gmt":"2023-03-30T08:47:31","slug":"effet-de-survol","status":"publish","type":"page","link":"https:\/\/lamartinieredesign.fr\/?page_id=1013","title":{"rendered":"Ressources HTML"},"content":{"rendered":"\n

1. Atelier page CV en pas \u00e0 pas<\/h4>\n\n\n\n
\n
\n
\"\"<\/a><\/figure>\n<\/div>\n\n\n\n
\n

Pour r\u00e9cup\u00e9rer les fichiers images n\u00e9cessaires :<\/p>\n\n\n\n

\n
T\u00e9l\u00e9charger<\/a><\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

2. Liens utiles<\/h4>\n\n\n\n

Voici quelques liens vers des ressources utiles \u00e0 la session HTML\/CSS.<\/p>\n\n\n\n

M\u00e9mento des propri\u00e9t\u00e9s HTML<\/a>
<\/a>Un r\u00e9capitulatif simple du r\u00f4le des principales balises HTML5, class\u00e9es par cat\u00e9gories d’usage et bien expliqu\u00e9es avec des exemples et des conseils d’usage. \u00c0 toujours avoir sous la main.<\/p>\n\n\n\n

M\u00e9mento des propri\u00e9t\u00e9s CSS<\/a>
La suite du pr\u00e9c\u00e9dent, mais d\u00e9di\u00e9 aux propri\u00e9t\u00e9s CSS. Tout aussi n\u00e9cessaire.<\/p>\n\n\n\n

Initialement, un M\u00e9mento raisonn\u00e9, vraiment simple et basique mais sans explications, avait \u00e9t\u00e9 publi\u00e9 par l’excellent site Classroom in a book. Il a disparu mais peut encore \u00eatre consult\u00e9 en PDF sur ce lien :<\/em> Memento HTML & CSS<\/a><\/p>\n\n\n\n

Liste compl\u00e8te des propri\u00e9t\u00e9s HTML<\/a>
C’est la fondation Mozilla pour les d\u00e9veloppers. C’est clair et complet. Pourquoi s’en priver?<\/p>\n\n\n\n

Liste compl\u00e8te des propri\u00e9t\u00e9s CSS<\/a>
Une bible, en anglais, mais tr\u00e8s compl\u00e8te et surtout tr\u00e8s clairement expliqu\u00e9e, avec des exemples d’utilisation, des propri\u00e9t\u00e9s CSS. A consulter sans mod\u00e9ration pour approfondir ses connaissances.<\/p>\n\n\n\n

Tuto complet HTML5\/CSS3<\/a>
Encore par OpenClassroom, un tuto complet qui r\u00e9capitule les grands principes d’utilisation des langages html5 et css3. Demandera un compte gratuit pour \u00eatre consult\u00e9 librement.<\/p>\n\n\n\n

Choisir une couleur pour le web<\/a>
Le site d’adobe pour trouver des harmonies color\u00e9es. Indispensable.<\/p>\n\n\n\n

Google Fonts<\/a>
Pour ajouter des fontes personnalis\u00e9es sur votre site. Incontournable aujourd’hui. Tout est clairement expliqu\u00e9 : choisir une fonte, cliquer sur le bouton quick use et suivre les instructions.<\/p>\n\n\n\n

Pour convertir ses propres fontes<\/a>
Pour int\u00e9grer ses propres fontes \u00e0 son site (\u00e0 condition d’avoir les droits sur ces fontes) il faut les convertir avant de les mettre dans le dossier racine. Une seule solution : Font Squirrel.<\/p>\n\n\n\n

Une liste d’outils dont on aura besoin un jour<\/a>
Parmi les plus int\u00e9ressant, le g\u00e9n\u00e9rateur de r\u00e8gles css3, notamment pour l’animation et les transitions.<\/p>\n\n\n\n

Utiliser les Flex Box<\/a>
Une explication assez compl\u00e8te et p\u00e9dagogique sur l’usage des flex box en CSS. Une fonctionnalit\u00e9 d’avenir \u00e0 apprendre \u00e0 ma\u00eetriser.<\/p>\n\n\n\n

Et pour r\u00e9aliser des mosa\u00efques d’images plus \u00e9labor\u00e9es<\/a>
R\u00e9serv\u00e9e aux plus aguerris d’entre-vous, la biblioth\u00e8que javascript Masonry. D\u00e9licat d’usage mais tellement plus beau.<\/p>\n\n\n\n

Des effets de survol d’image en CSS3<\/a>
Le code est donn\u00e9. Il reste \u00e0 l’adapter \u00e0 vos besoins, en plus simple \u00e9ventuellement.<\/p>\n\n\n\n

Un mur d’images en vrac<\/a>
Effet int\u00e9ressant. N\u00e9cessite cependant JQuery, donc quelques comp\u00e9tences avanc\u00e9es. Int\u00e9ressant cependant d’analyser le code source pour voir comment c’est fait. Bas\u00e9 sur la biblioth\u00e8que Masonry (voir plus haut).<\/p>\n\n\n\n

iHover<\/a>
Encore des effets de survol d’image<\/p>\n\n\n\n

3_ Atelier page Responsive en pas \u00e0 pas<\/h4>\n\n\n\n
\n
\n
\"\"<\/a><\/figure>\n<\/div>\n\n\n\n
\n

Pour r\u00e9cup\u00e9rer les fichiers images n\u00e9cessaires :<\/p>\n\n\n\n

\n
T\u00e9l\u00e9charger<\/a><\/div>\n<\/div>\n<\/div>\n<\/div>\n\n\n\n

<\/p>\n","protected":false},"excerpt":{"rendered":"

1. Atelier page CV en pas \u00e0 pas Pour r\u00e9cup\u00e9rer les fichiers images n\u00e9cessaires : 2. Liens utiles Voici quelques liens vers des ressources utiles \u00e0 la session HTML\/CSS. M\u00e9mento des propri\u00e9t\u00e9s HTMLUn r\u00e9capitulatif simple du r\u00f4le des principales balises HTML5, class\u00e9es par cat\u00e9gories d’usage et bien expliqu\u00e9es avec des exemples et des conseils d’usage. … Continuer la lecture de Ressources HTML<\/span> →<\/span><\/a><\/p>\n","protected":false},"author":1,"featured_media":0,"parent":931,"menu_order":0,"comment_status":"closed","ping_status":"closed","template":"","meta":{"_lmt_disableupdate":"","_lmt_disable":"","footnotes":""},"_links":{"self":[{"href":"https:\/\/lamartinieredesign.fr\/index.php?rest_route=\/wp\/v2\/pages\/1013"}],"collection":[{"href":"https:\/\/lamartinieredesign.fr\/index.php?rest_route=\/wp\/v2\/pages"}],"about":[{"href":"https:\/\/lamartinieredesign.fr\/index.php?rest_route=\/wp\/v2\/types\/page"}],"author":[{"embeddable":true,"href":"https:\/\/lamartinieredesign.fr\/index.php?rest_route=\/wp\/v2\/users\/1"}],"replies":[{"embeddable":true,"href":"https:\/\/lamartinieredesign.fr\/index.php?rest_route=%2Fwp%2Fv2%2Fcomments&post=1013"}],"version-history":[{"count":12,"href":"https:\/\/lamartinieredesign.fr\/index.php?rest_route=\/wp\/v2\/pages\/1013\/revisions"}],"predecessor-version":[{"id":4653,"href":"https:\/\/lamartinieredesign.fr\/index.php?rest_route=\/wp\/v2\/pages\/1013\/revisions\/4653"}],"up":[{"embeddable":true,"href":"https:\/\/lamartinieredesign.fr\/index.php?rest_route=\/wp\/v2\/pages\/931"}],"wp:attachment":[{"href":"https:\/\/lamartinieredesign.fr\/index.php?rest_route=%2Fwp%2Fv2%2Fmedia&parent=1013"}],"curies":[{"name":"wp","href":"https:\/\/api.w.org\/{rel}","templated":true}]}}