HTML<\/h2>\n<style type=\"text\/css\">\n <!--html{padding-top: 2%; \n background: url(http:\/\/goo.gl\/AkWbx) no-repeat; \n -webkit-background-size: cover;\n -moz-background-size: cover;\n -o-background-size: cover; \n background-size: cover;\n } \n #myForm{ background: #a0b4dc;\n border: 1px solid rgba(45,60,91,0.8);\n -webkit-border-radius: 10px;\n -moz-border-radius: 10px;\n border-radius: 10px; \n box-shadow: 0 6px 15px rgba(45,60,91,0.5);\n color: #333;\n font-family: 'Edwardian Script ITC';\n font-size: 24px; \n margin: 0 auto;\n padding: 10px 30px 30px 30px; \n width: 410px;\n } \n h2{ color: #2d3c5b; \n font-size: 20px; \n padding: 0;\n } \n textarea{ color: #444;\n font-family: 'Edwardian Script ITC';\n font-size: 24px;\n height: 200px;\n padding: 10px; \n width: 370px;\n }\n .charLeft{font-weight: bold; font-style: 'Edwardian Script ITC';\n } \n .charError{ color: #ff0000; \n }\n --><\/style> <\/textarea> Character Limit <span class=\"charLimit\"> <\/span> <span class=\"charLeft\"> <\/span><\/div>\n<p><!--based on the snippet written by Suprotim Agarwal at http:\/\/www.devcurry.com\/2009\/08\/limit-number-of-characters-in-textarea.html and modified to be more robustshout out to @webbushka for some guidance! http:\/\/codepen.io\/webbushka<br \/>--> <br\/><br\/><\/p>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<\/div>\n<style type=\"text\/css\"><!--\nhtml{\n padding-top: 2%;\n background: url(http:\/\/goo.gl\/AkWbx) no-repeat;\n -webkit-background-size: cover;\n -moz-background-size: cover;\n -o-background-size: cover;\n background-size: cover;\n}\n#myForm{\n background: #a0b4dc;\n border: 1px solid rgba(45,60,91,0.8);\n -webkit-border-radius: 10px;\n -moz-border-radius: 10px;\n border-radius: 10px;\n box-shadow: 0 6px 15px rgba(45,60,91,0.5);\n color: #333;\n font-family: 'Edwardian Script ITC';\n font-size: 24px;\n margin: 0 auto;\n padding: 10px 30px 30px 30px;\n width: 410px;\n}\nh2{\n color: #2d3c5b;\n font-size: 20px;\n padding: 0;\n}\ntextarea{\n color: #444;\n font-family: 'Edwardian Script ITC';\n font-size: 24px;\n height: 200px;\n padding: 10px;\n width: 370px;\n}\n.charLeft{\n font-weight: bold;\n font-style: 'Edwardian Script ITC';\n}\n.charError{\n color: #ff0000;\n}\n--><\/style> <\/div>\n\n\n \n\n <\/div>\n ", "eklablog") }) </script> <script> function isMobile() { return /Mobi|Android|iPhone|iPad|iPod|BlackBerry|IEMobile|Opera Mini/i.test(navigator.userAgent); } if (isMobile()) { (function() { var fbBtn = document.querySelector('.fb-share-button'); if (fbBtn) { fbBtn.classList.add("mobile-custom") var shareBtn = document.createElement('a'); shareBtn.href = `https://www.facebook.com/sharer/sharer.php?u=https%3A%2F%2Ftutorialgloriav.eklablog.com%2F-a118169790&t=`; shareBtn.target = "_blank"; shareBtn.rel = "noopener noreferrer"; shareBtn.innerHTML = '<svg xmlns="http://www.w3.org/2000/svg" viewBox="0 0 320 512"><path d="M279.14 288l14.22-92.66h-88.91v-60.13c0-25.35 12.42-50.06 52.24-50.06h40.42V6.26S260.43 0 225.36 0c-73.22 0-121.08 44.38-121.08 124.72v70.62H22.89V288h81.39v224h100.17V288z"/></svg>'; fbBtn.appendChild(shareBtn); } }()) } else { (function(d, s, id){ var js, fjs = d.getElementsByTagName(s)[0]; if (!d.getElementById(id)) { js = d.createElement(s); js.type = 'text/javascript'; js.async = true; js.defer = true; js.id = id; js.src = 'https://connect.facebook.net/fr_FR/sdk.js#xfbml=1&version=v25.0'; fjs.parentNode.insertBefore(js, fjs); } }(document, 'script', 'facebook-jssdk')); } </script> <script> (function(d, s, id){ var js, fjs = d.getElementsByTagName(s)[0]; if (!d.getElementById(id)) { js = d.createElement(s); js.type = 'text/javascript'; js.async = true; js.defer = true; js.id = id; js.src = 'https://platform.twitter.com/widgets.js'; fjs.parentNode.insertBefore(js, fjs); } }(document, 'script', 'twitter-jssdk')); </script> <div class="ob-Newsletter"> <button class="ob-input ob-Newsletter-toggle">S'inscrire à la newsletter</button> <div class="ob-Newsletter-box"> <div class="ob-Newsletter-description">Pour être informé des derniers articles, inscrivez vous :</div> <form class="ob-Newsletter-form" action="/mail/subscribe?utm_source=_ob_abo_newsletter&utm_medium=_ob_bottom_article" method="post"> <input class="ob-input ob-Newsletter-input" type="email" name="email" placeholder="Saisissez votre email ici" required="required" /> <input class="ob-input ob-Newsletter-submit" type="submit" value="Valider" /> </form> </div> </div> <script> var toggle = document.querySelector(".ob-Newsletter-toggle") var box = document.querySelector(".ob-Newsletter-box") toggle.addEventListener("click", function (event) { box.classList.toggle("ob-Newsletter-box--open") }) </script> <div class="ob-Related"> <div class="ob-h3 ob-Related-title">Vous aimerez aussi :</div> <div class="ob-Related-posts"> <div class="ob-Related-post"> <div class="ob-RelatedPost"> <a class="ob-RelatedPost-link" href="https://tutorialgloriav.eklablog.com/-a132530058" title=""> <img class="ob-RelatedPost-image" src="https://image.eklablog.com/s1KdErlwC1R7zQnuu94hhCV2xs4=/400x260/smart/filters:no_upscale()/https%3A%2F%2Flh3.googleusercontent.com%2F-drj07eUI7IQ%2FWfshPpdTtLI%2FAAAAAAADOm4%2FTd99GxjOCOENdzzPzZLDN5FnnBj4D7NSgCJoC%2Fw320-h240-rw%2F17.gif" alt=""/> <div class="ob-RelatedPost-title" > Article publié depuis Eklablog </div> </a> </div> </div> <div class="ob-Related-post"> <div class="ob-RelatedPost"> <a class="ob-RelatedPost-link" href="https://tutorialgloriav.eklablog.com/-a132530010" title=""> <img class="ob-RelatedPost-image" src="https://image.eklablog.com/vrxVjn1pjmR9-I1OYWbFVtaZ3Tk=/400x260/smart/filters:no_upscale()/https%3A%2F%2Flh3.googleusercontent.com%2F-6eSJcfFteoM%2FWfsidlbFYVI%2FAAAAAAADOrE%2Fj2oNYgt8VzE4jsWh8vwdiBuDNlFKZlGMwCJoC%2Fw292-h468-rw%2F20a.gif" alt=""/> <div class="ob-RelatedPost-title" > Article publié depuis Eklablog </div> </a> </div> </div> <div class="ob-Related-post"> <div class="ob-RelatedPost"> <a class="ob-RelatedPost-link" href="https://tutorialgloriav.eklablog.com/-a132529860" title=""> <img class="ob-RelatedPost-image" src="https://image.eklablog.com/PA_dUGBfsnf4SVyDzXLkEUtH7VU=/400x260/smart/filters:no_upscale()/https%3A%2F%2Flh3.googleusercontent.com%2F-Z71wS6lOmNE%2FWfyAV46cGSI%2FAAAAAAADOxM%2FzuCej6ophBAa0HTDh4C7GzB-lh0h0fYTQCJoC%2Fw356-h555-rw%2F2.gif" alt=""/> <div class="ob-RelatedPost-title" > Article publié depuis Eklablog </div> </a> </div> </div> <div class="ob-Related-post"> <div class="ob-RelatedPost"> <a class="ob-RelatedPost-link" href="https://tutorialgloriav.eklablog.com/-a132529810" title=""> <img class="ob-RelatedPost-image" src="https://image.eklablog.com/S8Mhv-ltnpAwfjGimMWVLIF-C0s=/400x260/smart/filters:no_upscale()/https%3A%2F%2Flh3.googleusercontent.com%2F-GgWdAE3rGjI%2FWfyQTJujPRI%2FAAAAAAADO0w%2FJPSejYaMeFcu9oHRK1G1NLPYVRp9w30eACJoC%2Fw360-h540-rw%2F1.gif" alt=""/> <div class="ob-RelatedPost-title" > Article publié depuis Eklablog </div> </a> </div> </div> </div> </div> <style> @media only screen and (min-width: 970px) { .ob-Related-posts { display: -webkit-box; display: -webkit-flex; display: -ms-flexbox; display: flex; -moz-box-wrap: nowrap; -webkit-box-wrap: nowrap; -webkit-flex-wrap: nowrap; -ms-flexbox-wrap: nowrap; -ms-flex-wrap: nowrap; flex-wrap: nowrap; -moz-box-direction: row; -webkit-box-direction: row; -webkit-box-orient: horizontal; -webkit-flex-direction: row; -ms-flexbox-direction: row; -ms-flex-direction: row; flex-direction: row; } .ob-Related-post { -webkit-box-basis: auto; -webkit-flex-basis: auto; -ms-flex-basis: auto; flex-basis: auto; -webkit-box-flex: 1; -moz-box-flex: 1; -webkit-flex: 1; -ms-flex: 1 0 auto; flex: 1; margin-bottom: 0; } .ob-Related-post:not(:last-child) { margin-right: 10px; } } </style> </div> <div class="Pagination"> </div> <!-- Comments box --> <div class="Comments"> <div class="ob-h3">Commenter cet article</div> <div> <div id="ob-comments"> <button class="ob-button-primary" disabled> Ajouter un commentaire </button> <div class="ob-list"> </div> </div> <script> var isCommentAppInitialized = false; function initCommentApp(){ if(!isCommentAppInitialized){ ob.initCommentApp(document.querySelector("#ob-comments"), {"postID":4019230,"locale":"fr","I18N":{"reply":"R\u00e9pondre","moderated":"Votre commentaire a bien \u00e9t\u00e9 envoy\u00e9.<br\/>Il s\u2019affichera une fois approuv\u00e9 par le propri\u00e9taire du blog.","recaptcha_disclaimer":"Ce site est prot\u00e9g\u00e9 par reCAPTCHA et les <a target=\"_blank\" rel=\"noreferer,noopener\" href=\"https:\/\/policies.google.com\/privacy\">Politiques de confidentialit\u00e9<\/a> et <a target=\"_blank\" rel=\"noreferer,noopener\" href=\"https:\/\/policies.google.com\/terms\">Conditions de service<\/a> de Google s'appliquent.","recaptcha_expired":"recaptcha_expired","recaptcha_error":"recaptcha_error","more_comments":"Charger plus de commentaires","more_replies":"Charger plus de r\u00e9ponses","author":"Auteur","name_placeholder":"Nom","email_placeholder":"Email","website_placeholder":"Site web","comment_placeholder":"Votre commentaire","send_comment":"Envoyer le commentaire","comment_with_overblog":"Commenter avec votre compte Eklablog","logout":"Se d\u00e9connecter","add_comment":"Ajouter un commentaire","generic_error":"Es ist ein Fehler aufgetreten, bitte versuchen Sie es sp\u00e4ter noch einmal"},"brand":"eklablog"}); isCommentAppInitialized = true } } setTimeout(initCommentApp, 2000) window.addEventListener('load', initCommentApp) </script> </div> </div> </div> <!-- **************************** --> <!-- ***** Sidebar ***** --> <!-- **************************** --> <aside class="Sidebar"> <!-- ***************** Sidebar: newsletter ********************* --> <div class="Sidebar-widget" data-order="2"> <div class="Sidebar-about SidebarSubscribe"> <div class="ob-h3 Sidebar-title"> Newsletter </div> <form class="Sidebar-form" action="/mail/subscribe?utm_source=_ob_abo_newsletter&utm_medium=_ob_sidebar" method="post"> <input class="ob-input SidebarForm-input" type="email" name="email" placeholder="Saisissez votre email ici" required="required" /> <input class="ob-input ob-input-submit SidebarForm-submit" type="submit" value="S'abonner" /> </form> </div> </div> <!-- ***************** Sidebar: Ads ***************** --> <!-- ***************** Sidebar: Tags ***************** --> <!-- ***************** Sidebar: Pages ***************** --> <!-- ***************** Sidebar: About ***************** --> <div class="Sidebar-widget Sidebar-about SidebarAbout" data-order="3"> <div class="ob-h3 Sidebar-title"> </div> <p class="SidebarAbout-description"> Tutorial, CSS, HTML <br>Voir le profil de <a href="https://www.eklablog.com/user/333295.html" target="_blank">GloriaV</a> sur le portail Eklablog </p> </div> <!-- ***************** Sidebar: Follow ***************** --> <div class="Sidebar-widget" data-order="5"> <div class="ob-h3 Sidebar-title"> Suivez-moi </div> <ul class="Sidebar-follow SidebarFollow"> <li class="SidebarFollow-element"> <a class="SidebarFollow-elementLink SidebarFollow-elementLink--rss" href="/rss" target="_blank"> <span class="fa fa-fw fa-rss"></span> </a> </li> </ul> </div> <!-- ****************** Sidebar: Biography ****************** --> <div class="Sidebar-widget Sidebar-about SidebarAbout" data-order="4"> <div class="ob-h3 Sidebar-title"> À propos </div> <a href="https://www.eklablog.com/user/333295.html" target="_blank"> <img class="SidebarAbout-avatar" src="https://image.eklablog.com/LYX6vCgy7VchPpruWFW7GR2ZN0c=/300x300/smart/filters:no_upscale()/https%3A%2F%2Fekladata.com%2Fj8TA7u2vBt7maG9CHh9APsLmuIk.gif" alt="GloriaV" /> </a> <p class="SidebarAbout-description"> <br>Voir le profil de <a href="https://www.eklablog.com/user/333295.html" target="_blank">GloriaV</a> sur le portail Eklablog </p> </div> <!-- ********************** Sidebar: Twitter Hub ********************** --> <!-- ********************** Sidebar: Facebook Hub ********************** --> <!-- ********************** Sidebar: Flickr Hub ********************** --> <!-- *********************** Sidebar: Free Module #1 *********************** --> <!-- *********************** Sidebar: Free Module #2 *********************** --> <!-- ***************** Sidebar: Ads #2 ***************** --> </aside> </div> <!-- **************************** --> <!-- ***** Footer ***** --> <!-- **************************** --> <!-- Footer --> <div class="Footer"> <p class="Footer-content"> Thème Magazine © -  Hébergé par <a href="https://www.eklablog.com" target="_bank">Eklablog</a> </p> </div> <!-- jQuery onReady --> <script type="text/javascript"> jQuery(document).ready(function() { /* Menu */ $(".Nav-menuButton").click(function(){ if($(".Nav-menu").hasClass("Nav-menu--open")) { $(".Nav-menu").removeClass("Nav-menu--open"); } else { $(".Nav-menu").addClass("Nav-menu--open"); } }); /* Search */ $(".NavSearch-icon").click(function(){ if($(".NavSearch").hasClass("NavSearch--open")) { if($(".NavSearch-input").val().length === 0) { $(".NavSearch").removeClass("NavSearch--open"); } else { $(".NavSearch-form").submit(); } } else { $(".NavSearch").addClass("NavSearch--open"); } }); /* Fancybox */ $(".ob-link-img, .author-avatar, .blog-avatar, .asset-img-link, .avatar").attr("rel", "fancybox"); $("a[rel=fancybox]").fancybox({ 'overlayShow' : true, 'transitionIn' : 'fadin', 'transitionOut' : 'fadin', 'type' : 'image' }); window.addEventListener("resize", function() { if (window.innerWidth > 970) { $(".menu-main").removeClass("menu-main--open"); } }) }); </script> <script async defer> function createDropdownTrigger() { var trigger = document.createElement("span") trigger.classList.add("trigger") return trigger } function addTriggers() { var elementsToTriggers = document.querySelectorAll(".menu_level_1 > .branch > span, .menu_level_1 > .branch > a") elementsToTriggers.forEach(function(elementToTrigger) { elementToTrigger.insertAdjacentElement("afterend", createDropdownTrigger()) }) } function triggerLevelHidden() { var lastMenuLevelElements = document.querySelectorAll(".menu_level_0") if (lastMenuLevelElements[0]) { lastMenuLevelElements.forEach(function(lastMenuLevelElement) { if (window.innerWidth <= 970) { lastMenuLevelElement.classList.add("level_hidden") } else { lastMenuLevelElement.classList.remove("level_hidden") } }) } } function handleDropdown() { var triggers = document.querySelectorAll(".trigger") var openSection = null; triggers.forEach(function(trigger) { trigger.addEventListener("click", function(e) { var menuLevel0 = e.target.nextElementSibling if (menuLevel0.style.maxHeight) { menuLevel0.style.maxHeight = null trigger.style.transform = "rotate(-45deg)" openSection = null; } else { if (openSection) { openSection.style.maxHeight = null; openSection.previousElementSibling.style.transform = "rotate(-45deg)"; } menuLevel0.style.maxHeight = menuLevel0.scrollHeight + "px" trigger.style.transform = "rotate(45deg)" openSection = menuLevel0; } }) }) } (function init() { addTriggers() triggerLevelHidden() handleDropdown() })() window.addEventListener("resize", function(e) { triggerLevelHidden() }) </script> <div class="ob-footer" id="legals" > <ul> <li class="ob-footer-item">Voir le profil de <a href="https://www.eklablog.com/user/333295.html" target="_blank">GloriaV</a> sur le portail Eklablog</li> <li class="ob-footer-item"><a href="/top">Top articles</a></li> <li class="ob-footer-item"><a href="/contact">Contact</a></li> <li class="ob-footer-item"><a href="https://www.eklablog.com/abuse/506131"> Signaler un abus </a></li> <li class="ob-footer-item"><a href="https://www.eklablog.com/terms-of-use" target="_blank">C.G.U.</a></li> <li class="ob-footer-item"><a href="https://www.eklablog.com/cookies" target="_blank">Cookies et données personnelles</a></li> <li class="ob-footer-item"><a href="javascript:Didomi.notice.show()">Préférences cookies</a></li> </ul> </div> <script> (function(w,d,s,l,i){w[l]=w[l]||[];w[l].push({'gtm.start': new Date().getTime(),event:'gtm.js'});var f=d.getElementsByTagName(s)[0], j=d.createElement(s),dl=l!='dataLayer'?'&l='+l:'';j.async=true;j.src= 'https://www.googletagmanager.com/gtm.js?id='+i+dl;f.parentNode.insertBefore(j,f); })(window,document,'script','dataLayer', "GTM-WG3SK3P"); </script> <script src="https://assets.over-blog-kiwi.com/b/blog/v2026.07.02/obfuscated_link.4b3f12e9.js"></script> </body> </html>