Code HTML – Page 7 – <HTML> #CSS

</a></h2> <div class="entry-meta"> </div> </header> <div class="entry-content"> <article class="article_balise article_title balise_title"> <h2 class='balise_titre'><title></h2> <section class='section_balise section_description balise_title'> <ul> <li>le titre de la page, soit le nom de l’onglet</li> <li>le nom donné au favori</li> <li>le titre du résultat d’un moteur de recherche</li> </ul> </section> <section class='section_balise section_attention balise_title'> <i class='fas fa-exclamation-triangle icon_attention' title='Attention'></i> Il ne peut y avoir qu'une seule balise <code class="codeHTML codeBalise"><title></code> sur la page </section> <section class='section_balise section_sandbox balise_title'> <div id="boxtitle" class="htmlView"> <div class="htmlViewSource fullContent"> <div class="bandeau bdSource"> <div class="fctLSource bdSource"> <button class="butFullCode all btn btn-default btn-sm tooltip" data-full="boxtitle"><i class="fa fa-eye" title="Afficher le code complet" data-titleHide="Cacher le code complet" data-titleView="Afficher le code complet"></i></button> </div> <div class="fctMSource bdSource"> Code </div> <div class="fctRSource bdSource"> <button class="butCopy copier btn btn-default btn-sm tooltip" data-copier="boxtitle"><i class="fa fa-copy" title="Copier le code html"></i></button> <button class="butReset resetCode reinit btn btn-default btn-sm tooltip" data-reinit="resetCode"><i class="fas fa-sync-alt" title="Réinitialiser le code html"></i></button> </div> </div> <div class="sourceContent light"> <textarea id="textHead-boxtitle" class="sourceHideHead editor"><!doctype html> <html> <head> <title>Mon premier site web</title> </head> <body></textarea> <textarea id="text-boxtitle" class="sourceView source editor" data-source="boxtitle"> <p>Coucou tout le monde !!</p> <p>Bienvenue sur mon site</p></textarea> <textarea id="textFoot-boxtitle" class="sourceHideFoot editor"> </body> </html></textarea> </div> </div> <div class="htmlViewButton"> <button class="butReset reinit btn btn-default btn-sm tooltip" data-reinit="resetAll"><i class="fas fa-sync-alt fa-3" title="Réinitialiser"></i></button> <button class="butTurn turn btn btn-default btn-sm tooltip" data-turn="0"><i class="fas fa-sign-in-alt fa-3 fa-rotate-90" title="Changer l'orientation de la vue"></i></button> <button class="butLight light btn btn-default btn-sm tooltip" data-light="0"><i class="fas fa-circle fa-3" title="Changer de mode"></i></button> <button class="butConvert convert btn btn-default btn-sm tooltip" data-convert="boxtitle"><i class="fas fa-chevron-circle-right fa-2" title="Voir le résultat"></i></button> </div> <div class="htmlViewCible"> <div class="bandeau bdCible"> <div class="fctLCible bdCible"> <button class="butReset reinit btn btn-default btn-sm tooltip" data-reinit="resetWeb"><i class="fas fa-sync-alt" title="Réinitialiser l'aperçu"></i></button> </div> <div class="fctMCible bdCible"> Aperçu dans le navigateur </div> <div class="fctRCible bdCible"> <button class="butVisuNav nav btn btn-default btn-sm tooltip" data-full="boxtitle"><i class="fas fa-globe" title="Visualiser dans une autre page web"></i></button> </div> </div> <div class="cibleView contentCible"> <iframe id="frameboxtitle" class="cible frameCible" src="http://htmlcss.pamaq.com/rendu.php" name="frameCss-boxtitle" scrolling="no" onload="resizeFrame('frameboxtitle')"></iframe> </div> </div> </div> <script> var cmboxtitle=CodeMirror.fromTextArea(document.getElementById("text-boxtitle"), { lineNumbers: false, mode: "text/html", theme: "fullcode", matchBrackets: true }) var cmHeadboxtitle=CodeMirror.fromTextArea(document.getElementById("textHead-boxtitle"), { lineNumbers: false, mode: "text/html", theme: "fullcode hide head", matchBrackets: true }) var cmFootboxtitle=CodeMirror.fromTextArea(document.getElementById("textFoot-boxtitle"), { lineNumbers: false, mode: "text/html", theme: "fullcode hide foot", readOnly: "true", matchBrackets: true }) jQuery("#textHead-boxtitle").data("CmHeadData", cmHeadboxtitle) jQuery("#text-boxtitle").data("CmData", cmboxtitle) jQuery("#textFoot-boxtitle").data("CmFootData", cmFootboxtitle) jQuery("#boxtitle .butReset").click(function(){ var reinitVal = jQuery(this).attr("data-reinit"); reinitcss(reinitVal,"boxtitle",cmboxtitle,cmHeadboxtitle,cmFootboxtitle); }); jQuery("#boxtitle .butCopy").click(function(){ copier("boxtitle",cmboxtitle,cmHeadboxtitle,cmFootboxtitle); }); jQuery("#boxtitle .butConvert").click(function(){ resizeFrame("frameboxtitle"); rendu("boxtitle",cmboxtitle,cmHeadboxtitle,cmFootboxtitle); }); jQuery("#boxtitle .butFullCode").click(function(){ fullCode("boxtitle"); }); jQuery("#boxtitle .butTurn").click(function(){ var rotate=jQuery(".butTurn").attr("data-turn"); turnPanel(rotate,"boxtitle"); }); jQuery("#boxtitle .butLight").click(function(){ var mode=jQuery(".butLight").attr("data-light"); lightPanel(mode); }); jQuery("#boxtitle .butVisuNav").click(function(){ visuNav("boxtitle"); }); </script> <form id="formVisu-boxtitle" action="http://htmlcss.pamaq.com/rendu.php" method="post" target="_blank"> <input name="code" type="hidden" id="value-boxtitle" value="<!doctype html> <html> <head> <title>Mon premier site web</title> </head> <body> <p>Coucou tout le monde !!</p> <p>Bienvenue sur mon site</p> </body> </html>"> </form> <form id="formRendu-boxtitle" action="http://htmlcss.pamaq.com/rendu.php" method="post" target="frameCss-boxtitle"> <input name="code" type="hidden" id="rendu-boxtitle" value="<!doctype html> <html> <head> <title>Mon premier site web</title> </head> <body> <p>Coucou tout le monde !!</p> <p>Bienvenue sur mon site</p> </body> </html>"> </form> </section> <section class='section_balise section_attribut balise_title'> <i class='fas fa-paperclip icon_attribut' title='Attributs de la balise'></i> <code class='codeHTML'><title></code> utilise les attributs globaux </section> <section class='section_balise section_css balise_title'> <i class='fab fa-css3-alt icon_css' title='Valeur Css par defaut'></i> <div id="title" class="codeView"> <div class="codeContentCss"> <textarea id="text-title" class="codeView code" data-source="title">title { display: none; }</textarea> </div> <script> var cmtitle=CodeMirror.fromTextArea(document.getElementById("text-title"), { lineNumbers: false, mode: "css", readOnly: "true", matchBrackets: true }) </script> </div> </section> <section class='section_balise section_ressource balise_title'> <i class='fas fa-link icon_ressource' title='Ressources'></i> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/title' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://html.spec.whatwg.org/multipage/semantics.html#the-title-element' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/whatwg.png" alt="HTML Living Standard" title="HTML Living Standard"></a></li><li><a href='https://caniuse.com/mdn-html_elements_title' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </section> </article> </div> <footer class="entry-footer"> </footer> </article> <article id="post-1191" class="post-1191 post type-post status-publish format-standard hentry category-attribut category-code_html"> <header class="entry-header"> <h2 class="entry-title"><a href="http://htmlcss.pamaq.com/base-target/" rel="bookmark">target-base</a></h2> <div class="entry-meta"> </div> </header> <div class="entry-content"> <article class="article_attribut article_titre attribut_target" data-parent=""> <h3 class="attr_title">target</h3> <section class="section_attribut section_description attribut_target"> Spécifie la façon dont les liens vont s’ouvrir </section> <section class="section_attribut section_syntax attribut_target"> <i class="fas fa-chevron-circle-right icon_syntax" title="Syntax"></i> <code class='codeHTML'><base target="<i>valeur</i>"></code> </section> <section class="section_attribut section_valeur attribut_target"> <table class="table_attribut"> <thead> <tr class="th"> <th class=”attr-date”>Valeur</th> <th class=”attr-desc”>Description</th> <th class=”attr-info”>Infos</th> </tr> </thead> <tbody> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> _blank </td> <td class="attr_cellule attr_desc" data-label="Description"> L'ouverture des liens se passe dans une nouvelle fenêtre ou un nouvel onglet </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/base#target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://html.spec.whatwg.org/multipage/semantics.html#attr-base-target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/whatwg.png" alt="HTML Living Standard" title="HTML Living Standard"></a></li><li><a href='https://caniuse.com/mdn-html_elements_base_target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><base target="_blank"></code><br> <div id="01191" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-01191" class="codeView code inline" data-source="01191"><base href="http://www.monsiteweb.com/" target="_blank"></textarea> </div> <script> var cm01191=CodeMirror.fromTextArea(document.getElementById("text-01191"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> _self </td> <td class="attr_cellule attr_desc" data-label="Description"> <ul> <li>Valeur par defaut</li> <li>L'ouverture des liens est dans cette même fenêtre</li> </ul> </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/base#target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://html.spec.whatwg.org/multipage/semantics.html#attr-base-target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/whatwg.png" alt="HTML Living Standard" title="HTML Living Standard"></a></li><li><a href='https://caniuse.com/mdn-html_elements_base_target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><base target="_self"></code><br> <div id="11191" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-11191" class="codeView code inline" data-source="11191"><base href="http://www.monsiteweb.com/" target="_self"></textarea> </div> <script> var cm11191=CodeMirror.fromTextArea(document.getElementById("text-11191"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> _parent </td> <td class="attr_cellule attr_desc" data-label="Description"> <ul> <li>Cette valeur est principalement employée lors de l'utilisation de cadre (frame)</li> <li>L'ouverture des liens se passe dans la fenêtre parent</li> </ul> </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/base#target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://html.spec.whatwg.org/multipage/semantics.html#attr-base-target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/whatwg.png" alt="HTML Living Standard" title="HTML Living Standard"></a></li><li><a href='https://caniuse.com/mdn-html_elements_base_target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><base target="_parent"></code><br> <div id="21191" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-21191" class="codeView code inline" data-source="21191"><base target="_parent"></textarea> </div> <script> var cm21191=CodeMirror.fromTextArea(document.getElementById("text-21191"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> _top </td> <td class="attr_cellule attr_desc" data-label="Description"> <ul> <li>Cette valeur est principalement employée lors de l'utilisation de cadre (frame)</li> <li>L'ouverture des liens se passe dans la fenêtre du plus haut niveau</li> </ul> </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/base#target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://html.spec.whatwg.org/multipage/semantics.html#attr-base-target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/whatwg.png" alt="HTML Living Standard" title="HTML Living Standard"></a></li><li><a href='https://caniuse.com/mdn-html_elements_base_target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><base target="_top"></code><br> <div id="31191" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-31191" class="codeView code inline" data-source="31191"><base target="_top"></textarea> </div> <script> var cm31191=CodeMirror.fromTextArea(document.getElementById("text-31191"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> </tbody> </table> </section> </article> </div> <footer class="entry-footer"> </footer> </article> <article id="post-1182" class="post-1182 post type-post status-publish format-standard hentry category-attribut category-code_html"> <header class="entry-header"> <h2 class="entry-title"><a href="http://htmlcss.pamaq.com/base-href/" rel="bookmark">href-base</a></h2> <div class="entry-meta"> </div> </header> <div class="entry-content"> <article class="article_attribut article_titre attribut_href" data-parent=""> <h3 class="attr_title">href</h3> <section class="section_attribut section_description attribut_href"> Indique l’url de base à utiliser pour reformer les liens relatif de la page </section> <section class="section_attribut section_syntax attribut_href"> <i class="fas fa-chevron-circle-right icon_syntax" title="Syntax"></i> <code class='codeHTML'><base href="<i>url</i>"></code> </section> <section class="section_attribut section_valeur attribut_href"> <table class="table_attribut"> <thead> <tr class="th"> <th class=”attr-date”>Valeur</th> <th class=”attr-desc”>Description</th> <th class=”attr-info”>Infos</th> </tr> </thead> <tbody> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> <i>url</i> </td> <td class="attr_cellule attr_desc" data-label="Description"> <ul> <li>L'url, le lien servant de base</li> <li>En valeur absolue (le plus souvent) ou en valeur relative</li> </ul> </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/base' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://html.spec.whatwg.org/multipage/semantics.html#attr-base-href' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/whatwg.png" alt="HTML Living Standard" title="HTML Living Standard"></a></li><li><a href='https://caniuse.com/mdn-html_elements_base_href' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><base href=</code><br> <div id="01182" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-01182" class="codeView code inline" data-source="01182"><base href="http://www.monsiteweb.com/"></textarea> </div> <script> var cm01182=CodeMirror.fromTextArea(document.getElementById("text-01182"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> </tbody> </table> </section> </article> </div> <footer class="entry-footer"> </footer> </article> <article id="post-1167" class="post-1167 post type-post status-publish format-standard hentry category-code_html category-balises-en-tete"> <header class="entry-header"> <h2 class="entry-title"><a href="http://htmlcss.pamaq.com/base/" rel="bookmark"><base></a></h2> <div class="entry-meta"> </div> </header> <div class="entry-content"> <article class="article_balise article_base balise_base"> <h2 class='balise_titre'><base></h2> <section class='section_balise section_description balise_base'> <code class="codeHTML"><base></code> définit l’URL de base qui servira à reformer les liens relatif de la page courante </section> <section class='section_balise section_attention balise_base'> <i class='fas fa-exclamation-triangle icon_attention' title='Attention'></i> <ul> <li>Il ne peut y avoir qu'une seule balise <code class="codeHTML"><base></code> dans une page.</li> <li><code class="codeHTML"><base></code> doit contenir au moins un des deux attributs.</li> </ul> </section> <section class='section_balise section_sandbox balise_base'> <div id="boxbase" class="htmlView"> <div class="htmlViewSource fullContent"> <div class="bandeau bdSource"> <div class="fctLSource bdSource"> <button class="butFullCode all btn btn-default btn-sm tooltip" data-full="boxbase"><i class="fa fa-eye" title="Afficher le code complet" data-titleHide="Cacher le code complet" data-titleView="Afficher le code complet"></i></button> </div> <div class="fctMSource bdSource"> Code </div> <div class="fctRSource bdSource"> <button class="butCopy copier btn btn-default btn-sm tooltip" data-copier="boxbase"><i class="fa fa-copy" title="Copier le code html"></i></button> <button class="butReset resetCode reinit btn btn-default btn-sm tooltip" data-reinit="resetCode"><i class="fas fa-sync-alt" title="Réinitialiser le code html"></i></button> </div> </div> <div class="sourceContent light"> <textarea id="textHead-boxbase" class="sourceHideHead editor"><html> <head> <title>Mon premier site web</title> <base href="http://htmlcss.pamaq.com/" target="_blank"> </head> <body></textarea> <textarea id="text-boxbase" class="sourceView source editor" data-source="boxbase"> <p>Coucou bonjour tout le monde !!</p> <p><a href="base">Ce lien</a> ouvrira la page http://htmlcss.pamaq.com/base dans une nouvelle fenêtre</p></textarea> <textarea id="textFoot-boxbase" class="sourceHideFoot editor"> </body> </html></textarea> </div> </div> <div class="htmlViewButton"> <button class="butReset reinit btn btn-default btn-sm tooltip" data-reinit="resetAll"><i class="fas fa-sync-alt fa-3" title="Réinitialiser"></i></button> <button class="butTurn turn btn btn-default btn-sm tooltip" data-turn="0"><i class="fas fa-sign-in-alt fa-3 fa-rotate-90" title="Changer l'orientation de la vue"></i></button> <button class="butLight light btn btn-default btn-sm tooltip" data-light="0"><i class="fas fa-circle fa-3" title="Changer de mode"></i></button> <button class="butConvert convert btn btn-default btn-sm tooltip" data-convert="boxbase"><i class="fas fa-chevron-circle-right fa-2" title="Voir le résultat"></i></button> </div> <div class="htmlViewCible"> <div class="bandeau bdCible"> <div class="fctLCible bdCible"> <button class="butReset reinit btn btn-default btn-sm tooltip" data-reinit="resetWeb"><i class="fas fa-sync-alt" title="Réinitialiser l'aperçu"></i></button> </div> <div class="fctMCible bdCible"> Aperçu dans le navigateur </div> <div class="fctRCible bdCible"> <button class="butVisuNav nav btn btn-default btn-sm tooltip" data-full="boxbase"><i class="fas fa-globe" title="Visualiser dans une autre page web"></i></button> </div> </div> <div class="cibleView contentCible"> <iframe id="frameboxbase" class="cible frameCible" src="http://htmlcss.pamaq.com/rendu.php" name="frameCss-boxbase" scrolling="no" onload="resizeFrame('frameboxbase')"></iframe> </div> </div> </div> <script> var cmboxbase=CodeMirror.fromTextArea(document.getElementById("text-boxbase"), { lineNumbers: false, mode: "text/html", theme: "fullcode", matchBrackets: true }) var cmHeadboxbase=CodeMirror.fromTextArea(document.getElementById("textHead-boxbase"), { lineNumbers: false, mode: "text/html", theme: "fullcode hide head", matchBrackets: true }) var cmFootboxbase=CodeMirror.fromTextArea(document.getElementById("textFoot-boxbase"), { lineNumbers: false, mode: "text/html", theme: "fullcode hide foot", readOnly: "true", matchBrackets: true }) jQuery("#textHead-boxbase").data("CmHeadData", cmHeadboxbase) jQuery("#text-boxbase").data("CmData", cmboxbase) jQuery("#textFoot-boxbase").data("CmFootData", cmFootboxbase) jQuery("#boxbase .butReset").click(function(){ var reinitVal = jQuery(this).attr("data-reinit"); reinitcss(reinitVal,"boxbase",cmboxbase,cmHeadboxbase,cmFootboxbase); }); jQuery("#boxbase .butCopy").click(function(){ copier("boxbase",cmboxbase,cmHeadboxbase,cmFootboxbase); }); jQuery("#boxbase .butConvert").click(function(){ resizeFrame("frameboxbase"); rendu("boxbase",cmboxbase,cmHeadboxbase,cmFootboxbase); }); jQuery("#boxbase .butFullCode").click(function(){ fullCode("boxbase"); }); jQuery("#boxbase .butTurn").click(function(){ var rotate=jQuery(".butTurn").attr("data-turn"); turnPanel(rotate,"boxbase"); }); jQuery("#boxbase .butLight").click(function(){ var mode=jQuery(".butLight").attr("data-light"); lightPanel(mode); }); jQuery("#boxbase .butVisuNav").click(function(){ visuNav("boxbase"); }); </script> <form id="formVisu-boxbase" action="http://htmlcss.pamaq.com/rendu.php" method="post" target="_blank"> <input name="code" type="hidden" id="value-boxbase" value="<html> <head> <title>Mon premier site web</title> <base href="http://htmlcss.pamaq.com/" target="_blank"> </head> <body> <p>Coucou bonjour tout le monde !!</p> <p><a href="base">Ce lien</a> ouvrira la page http://htmlcss.pamaq.com/base dans une nouvelle fenêtre</p> </body> </html>"> </form> <form id="formRendu-boxbase" action="http://htmlcss.pamaq.com/rendu.php" method="post" target="frameCss-boxbase"> <input name="code" type="hidden" id="rendu-boxbase" value="<html> <head> <title>Mon premier site web</title> <base href="http://htmlcss.pamaq.com/" target="_blank"> </head> <body> <p>Coucou bonjour tout le monde !!</p> <p><a href="base">Ce lien</a> ouvrira la page http://htmlcss.pamaq.com/base dans une nouvelle fenêtre</p> </body> </html>"> </form> </section> <section class='section_balise section_attribut balise_base'> <i class='fas fa-paperclip icon_attribut' title='Attributs de la balise'></i> <code class='codeHTML'><base></code> utilise les attributs globaux <article class="article_attribut article_titre attribut_href" data-parent=""> <h3 class="attr_title">href</h3> <section class="section_attribut section_description attribut_href"> Indique l'url de base à utiliser pour reformer les liens relatif de la page </section> <section class="section_attribut section_syntax attribut_href"> <i class="fas fa-chevron-circle-right icon_syntax" title="Syntax"></i> <code class='codeHTML'><base href="<i>url</i>"></code> </section> <section class="section_attribut section_valeur attribut_href"> <table class="table_attribut"> <thead> <tr class="th"> <th class=”attr-date”>Valeur</th> <th class=”attr-desc”>Description</th> <th class=”attr-info”>Infos</th> </tr> </thead> <tbody> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> <i>url</i> </td> <td class="attr_cellule attr_desc" data-label="Description"> <ul> <li>L'url, le lien servant de base</li> <li>En valeur absolue (le plus souvent) ou en valeur relative</li> </ul> </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/base' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://html.spec.whatwg.org/multipage/semantics.html#attr-base-href' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/whatwg.png" alt="HTML Living Standard" title="HTML Living Standard"></a></li><li><a href='https://caniuse.com/mdn-html_elements_base_href' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><base href=</code><br> <div id="01182" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-01182" class="codeView code inline" data-source="01182"><base href="http://www.monsiteweb.com/"></textarea> </div> <script> var cm01182=CodeMirror.fromTextArea(document.getElementById("text-01182"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> </tbody> </table> </section> </article> <article class="article_attribut article_titre attribut_target" data-parent=""> <h3 class="attr_title">target</h3> <section class="section_attribut section_description attribut_target"> Spécifie la façon dont les liens vont s'ouvrir </section> <section class="section_attribut section_syntax attribut_target"> <i class="fas fa-chevron-circle-right icon_syntax" title="Syntax"></i> <code class='codeHTML'><base target="<i>valeur</i>"></code> </section> <section class="section_attribut section_valeur attribut_target"> <table class="table_attribut"> <thead> <tr class="th"> <th class=”attr-date”>Valeur</th> <th class=”attr-desc”>Description</th> <th class=”attr-info”>Infos</th> </tr> </thead> <tbody> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> _blank </td> <td class="attr_cellule attr_desc" data-label="Description"> L'ouverture des liens se passe dans une nouvelle fenêtre ou un nouvel onglet </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/base#target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://html.spec.whatwg.org/multipage/semantics.html#attr-base-target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/whatwg.png" alt="HTML Living Standard" title="HTML Living Standard"></a></li><li><a href='https://caniuse.com/mdn-html_elements_base_target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><base target="_blank"></code><br> <div id="01191" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-01191" class="codeView code inline" data-source="01191"><base href="http://www.monsiteweb.com/" target="_blank"></textarea> </div> <script> var cm01191=CodeMirror.fromTextArea(document.getElementById("text-01191"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> _self </td> <td class="attr_cellule attr_desc" data-label="Description"> <ul> <li>Valeur par defaut</li> <li>L'ouverture des liens est dans cette même fenêtre</li> </ul> </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/base#target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://html.spec.whatwg.org/multipage/semantics.html#attr-base-target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/whatwg.png" alt="HTML Living Standard" title="HTML Living Standard"></a></li><li><a href='https://caniuse.com/mdn-html_elements_base_target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><base target="_self"></code><br> <div id="11191" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-11191" class="codeView code inline" data-source="11191"><base href="http://www.monsiteweb.com/" target="_self"></textarea> </div> <script> var cm11191=CodeMirror.fromTextArea(document.getElementById("text-11191"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> _parent </td> <td class="attr_cellule attr_desc" data-label="Description"> <ul> <li>Cette valeur est principalement employée lors de l'utilisation de cadre (frame)</li> <li>L'ouverture des liens se passe dans la fenêtre parent</li> </ul> </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/base#target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://html.spec.whatwg.org/multipage/semantics.html#attr-base-target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/whatwg.png" alt="HTML Living Standard" title="HTML Living Standard"></a></li><li><a href='https://caniuse.com/mdn-html_elements_base_target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><base target="_parent"></code><br> <div id="21191" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-21191" class="codeView code inline" data-source="21191"><base target="_parent"></textarea> </div> <script> var cm21191=CodeMirror.fromTextArea(document.getElementById("text-21191"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> _top </td> <td class="attr_cellule attr_desc" data-label="Description"> <ul> <li>Cette valeur est principalement employée lors de l'utilisation de cadre (frame)</li> <li>L'ouverture des liens se passe dans la fenêtre du plus haut niveau</li> </ul> </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/base#target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://html.spec.whatwg.org/multipage/semantics.html#attr-base-target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/whatwg.png" alt="HTML Living Standard" title="HTML Living Standard"></a></li><li><a href='https://caniuse.com/mdn-html_elements_base_target' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><base target="_top"></code><br> <div id="31191" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-31191" class="codeView code inline" data-source="31191"><base target="_top"></textarea> </div> <script> var cm31191=CodeMirror.fromTextArea(document.getElementById("text-31191"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> </tbody> </table> </section> </article> </section> <section class='section_balise section_css balise_base'> <i class='fab fa-css3-alt icon_css' title='Valeur Css par defaut'></i> Aucune valeur Css </section> <section class='section_balise section_ressource balise_base'> <i class='fas fa-link icon_ressource' title='Ressources'></i> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/base' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://html.spec.whatwg.org/multipage/semantics.html#the-base-element' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/whatwg.png" alt="HTML Living Standard" title="HTML Living Standard"></a></li><li><a href='https://caniuse.com/mdn-html_elements_base' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </section> </article> </div> <footer class="entry-footer"> </footer> </article> <article id="post-1158" class="post-1158 post type-post status-publish format-standard hentry category-attribut category-code_html"> <header class="entry-header"> <h2 class="entry-title"><a href="http://htmlcss.pamaq.com/type-script/" rel="bookmark">type-script</a></h2> <div class="entry-meta"> </div> </header> <div class="entry-content"> <article class="article_attribut article_titre attribut_type" data-parent=""> <h3 class="attr_title">type</h3> <section class="section_attribut section_description attribut_type"> <ul><li>L’attribut type indique le type du fichier lié par l’attribut <code class="codeHTML">src</code></li><li>Il sert à identifier également le script inséré entre <script> et </script></li></ul> </section> <section class="section_attribut section_syntax attribut_type"> <i class="fas fa-chevron-circle-right icon_syntax" title="Syntax"></i> <code class='codeHTML'><script type="<i>valeur</i>"></script></code> </section> <section class="section_attribut section_valeur attribut_type"> <table class="table_attribut"> <thead> <tr class="th"> <th class=”attr-date”>Valeur</th> <th class=”attr-desc”>Description</th> <th class=”attr-info”>Infos</th> </tr> </thead> <tbody> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> <i>type de document</i> </td> <td class="attr_cellule attr_desc" data-label="Description"> <ul> <li>La liste des types est disponible sur <a href="https://www.iana.org/assignments/media-types/media-types.xhtml" target="_blank">IANA Media Types list</a></li> <li>La valeur la plus fréquente est : text/javascript pour un l'insertion d'un script javascript</li> </ul> </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/link#attr-type' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://html.spec.whatwg.org/multipage/semantics.html#processing-the-type-attribute' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/whatwg.png" alt="HTML Living Standard" title="HTML Living Standard"></a></li><li><a href='https://caniuse.com/mdn-html_elements_script_type' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><script type="<i>valeur</i>"></script></code><br> <div id="01158" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-01158" class="codeView code inline" data-source="01158"><script type="text/javascript" src="js/script.js"></script></textarea> </div> <script> var cm01158=CodeMirror.fromTextArea(document.getElementById("text-01158"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> </tbody> </table> </section> </article> </div> <footer class="entry-footer"> </footer> </article> <article id="post-1113" class="post-1113 post type-post status-publish format-standard hentry category-attribut category-code_html"> <header class="entry-header"> <h2 class="entry-title"><a href="http://htmlcss.pamaq.com/referrerpolicy-script/" rel="bookmark">referrerpolicy-script</a></h2> <div class="entry-meta"> </div> </header> <div class="entry-content"> <article class="article_attribut article_titre attribut_referrerpolicy" data-parent=""> <h3 class="attr_title">referrerpolicy</h3> <section class="section_attribut section_description attribut_referrerpolicy"> Indique les informations à envoyer lors du chargement du fichier spécifié dans l’attribut <code>src</code> </section> <section class="section_attribut section_attention attribut_referrerpolicy"> <i class="fas fa-exclamation-triangle icon_attention" title="Attention"></i> Fonctionne uniquement avec l'attribut <code>src</code> </section> <section class="section_attribut section_conseil attribut_referrerpolicy"> <i class="far fa-thumbs-up icon_conseil" title="Conseil - Recommandation"></i> <ul> <li>L'en-tête <b>Referer</b> contient l'adresse de la page web précédente.<br>Elle est définie suite au clique d'un lien qui aboutit à la page courante. Cela permet de suivre la provenance des internautes et d'en tirer des informations à analyser</li> <li>L'<b>origine</b> est définie par le protocole, l'hôte et le port (si indiqué) de la page courante.<br>Par exemple : https://www.monsiteweb.com:443<br>Le protocole est https<br>L'hôte est www.monsiteweb.com<br>Le port est 443</li> </ul> </section> <section class="section_attribut section_syntax attribut_referrerpolicy"> <i class="fas fa-chevron-circle-right icon_syntax" title="Syntax"></i> <code class='codeHTML'><script src="<i>url</i>" referrerpolicy="<i>valeur</i>"></script></code> </section> <section class="section_attribut section_valeur attribut_referrerpolicy"> <table class="table_attribut"> <thead> <tr class="th"> <th class=”attr-date”>Valeur</th> <th class=”attr-desc”>Description</th> <th class=”attr-info”>Infos</th> </tr> </thead> <tbody> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> no-referrer-when-downgrade </td> <td class="attr_cellule attr_desc" data-label="Description"> <ul> <li>Valeur par défaut</li> <li>Indique que les informations d'en-tête <b>Referer</b> ne seront envoyée que si le fichier spécifié dans l'attribut <code>src</code> provient d'un site sécurisé équivalent ou plus élevé (https)</li> </ul> </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/script#attr-referrerpolicy' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://www.w3.org/TR/referrer-policy/#referrer-policy-no-referrer-when-downgrade' target='_blank'><i class="fas fa-external-link-square-alt icon_lien"></i></a></li><li><a href='https://caniuse.com/mdn-html_elements_script_referrerpolicy' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><script src="<i>url</i>" referrerpolicy="no-referrer-when-downgrade"></script></code><br> <div id="01113" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-01113" class="codeView code inline" data-source="01113"><script src="https://www.unsiteweb.com/js/script.js" referrerpolicy="no-referrer-when-downgrade"></script></textarea> </div> <script> var cm01113=CodeMirror.fromTextArea(document.getElementById("text-01113"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> no-referrer </td> <td class="attr_cellule attr_desc" data-label="Description"> Signifie qu'aucune information d'en-tête <b>Referer</b> ne sera envoyée </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/script#attr-referrerpolicy' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://www.w3.org/TR/referrer-policy/#referrer-policy-no-referrer' target='_blank'><i class="fas fa-external-link-square-alt icon_lien"></i></a></li><li><a href='https://caniuse.com/?search=no-referrer' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><script src="<i>url</i>" referrerpolicy="no-referrer"></script></code><br> <div id="11113" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-11113" class="codeView code inline" data-source="11113"><script src="https://www.unsiteweb.com/js/script.js" referrerpolicy="no-referrer"></script></textarea> </div> <script> var cm11113=CodeMirror.fromTextArea(document.getElementById("text-11113"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> origin </td> <td class="attr_cellule attr_desc" data-label="Description"> Envoi les informations d'<b>origine</b> du fichier saisi dans l'attribut <code>src</code> comme en-tête <b>Referer</b> </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/script#attr-referrerpolicy' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://www.w3.org/TR/referrer-policy/#referrer-policy-origin' target='_blank'><i class="fas fa-external-link-square-alt icon_lien"></i></a></li><li><a href='https://caniuse.com/mdn-http_headers_origin' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><script src="<i>url</i>" referrerpolicy="origin"></script></code><br> <div id="21113" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-21113" class="codeView code inline" data-source="21113"><script src="https://www.unsiteweb.com/js/script.js" referrerpolicy="origin"></script></textarea> </div> <script> var cm21113=CodeMirror.fromTextArea(document.getElementById("text-21113"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> same-origin </td> <td class="attr_cellule attr_desc" data-label="Description"> Envoi les informations d'<b>origine</b> du fichier saisi dans l'attribut <code>src</code> comme en-tête <b>Referer</b> s'il a la même <b>origine</b> </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/script#attr-referrerpolicy' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://www.w3.org/TR/referrer-policy/#referrer-policy-same-origin' target='_blank'><i class="fas fa-external-link-square-alt icon_lien"></i></a></li><li><a href='https://caniuse.com/mdn-http_headers_referrer-policy_same-origin' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><script src="<i>url</i>" referrerpolicy="same-origin"></script></code><br> <div id="31113" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-31113" class="codeView code inline" data-source="31113"><script src="https://www.unsiteweb.com/js/script.js" referrerpolicy="same-origin"></script></textarea> </div> <script> var cm31113=CodeMirror.fromTextArea(document.getElementById("text-31113"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> origin-when-cross-origin </td> <td class="attr_cellule attr_desc" data-label="Description"> Envoi les informations d'<b>origine</b> du fichier saisi dans l'attribut <code>src</code> comme en-tête <b>Referer</b> lorsqu'il n'a pas la même <b>origine</b>, sinon envoi l'url complète </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/script#attr-referrerpolicy' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://www.w3.org/TR/referrer-policy/#referrer-policy-origin-when-cross-origin' target='_blank'><i class="fas fa-external-link-square-alt icon_lien"></i></a></li><li><a href='https://caniuse.com/mdn-http_headers_referrer-policy_strict-origin-when-cross-origin' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><script src="<i>url</i>" referrerpolicy="origin"></script></code><br> <div id="41113" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-41113" class="codeView code inline" data-source="41113"><script src="https://www.unsiteweb.com/js/script.js" referrerpolicy="origin"></script></textarea> </div> <script> var cm41113=CodeMirror.fromTextArea(document.getElementById("text-41113"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> strict-origin </td> <td class="attr_cellule attr_desc" data-label="Description"> Envoi les informations d'<b>origine</b> du fichier saisi dans l'attribut <code>src</code> comme en-tête <b>Referer</b> lorsque le protocole est le même </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/script#attr-referrerpolicy' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://www.w3.org/TR/referrer-policy/#referrer-policy-strict-origin' target='_blank'><i class="fas fa-external-link-square-alt icon_lien"></i></a></li><li><a href='https://caniuse.com/mdn-http_headers_referrer-policy_strict-origin' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><script src="<i>url</i>" referrerpolicy="strict-origin"></script></code><br> <div id="51113" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-51113" class="codeView code inline" data-source="51113"><script src="https://www.unsiteweb.com/js/script.js" referrerpolicy="strict-origin"></script></textarea> </div> <script> var cm51113=CodeMirror.fromTextArea(document.getElementById("text-51113"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> strict-origin-when-cross-origin </td> <td class="attr_cellule attr_desc" data-label="Description"> Envoi les informations d'<b>origine</b> du fichier saisi dans l'attribut <code>src</code> comme en-tête <b>Referer</b> lorsqu'il n'a pas la même <b>origine</b>, sinon envoi l'url compléte si le protocole est le même </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/script#attr-referrerpolicy' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://www.w3.org/TR/referrer-policy/#referrer-policy-strict-origin-when-cross-origin' target='_blank'><i class="fas fa-external-link-square-alt icon_lien"></i></a></li><li><a href='https://caniuse.com/mdn-http_headers_referrer-policy_strict-origin-when-cross-origin' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><script src="<i>url</i>" referrerpolicy="strict-origin-when-cross-origin"></script></code><br> <div id="61113" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-61113" class="codeView code inline" data-source="61113"><script src="https://www.unsiteweb.com/js/script.js" referrerpolicy="strict-origin-when-cross-origin"></script></textarea> </div> <script> var cm61113=CodeMirror.fromTextArea(document.getElementById("text-61113"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> unsafe-url </td> <td class="attr_cellule attr_desc" data-label="Description"> <ul> <li>Envoi les informations d'en-tête <b>Referer</b> du fichier indiqué dans l'attribut <code>src</code> dans tout les cas</li> <li>ATTENTION : cette valeur présente un grand risque de sécurité</li> </ul> </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/script#attr-referrerpolicy' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://www.w3.org/TR/referrer-policy/#referrer-policy-unsafe-url' target='_blank'><i class="fas fa-external-link-square-alt icon_lien"></i></a></li><li><a href='https://caniuse.com/mdn-html_elements_script_referrerpolicy' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><script src="<i>url</i>" referrerpolicy="unsafe-url"></script></code><br> <div id="71113" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-71113" class="codeView code inline" data-source="71113"><script src="https://www.unsiteweb.com/js/script.js" referrerpolicy="unsafe-url"></script></textarea> </div> <script> var cm71113=CodeMirror.fromTextArea(document.getElementById("text-71113"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> </tbody> </table> </section> </article> </div> <footer class="entry-footer"> </footer> </article> <article id="post-1108" class="post-1108 post type-post status-publish format-standard hentry category-attribut category-code_html"> <header class="entry-header"> <h2 class="entry-title"><a href="http://htmlcss.pamaq.com/defer-script/" rel="bookmark">defer-script</a></h2> <div class="entry-meta"> </div> </header> <div class="entry-content"> <article class="article_attribut article_titre attribut_defer" data-parent=""> <h3 class="attr_title">defer</h3> <section class="section_attribut section_description attribut_defer"> Indique que le fichier saisie dans l’attribut <code>src</code> doit être téléchargé en parallèle de l’affichage de la page et exécuté dès que la page sera entièrement chargé </section> <section class="section_attribut section_attention attribut_defer"> <i class="fas fa-exclamation-triangle icon_attention" title="Attention"></i> Ne fonctionne qu'avec l'attribut <code>src</code> </section> <section class="section_attribut section_syntax attribut_defer"> <i class="fas fa-chevron-circle-right icon_syntax" title="Syntax"></i> <code class='codeHTML'><script src="<i>url</i>" defer></code> </section> <section class="section_attribut section_valeur attribut_defer"> <table class="table_attribut"> <thead> <tr class="th"> <th class=”attr-date”>Valeur</th> <th class=”attr-desc”>Description</th> <th class=”attr-info”>Infos</th> </tr> </thead> <tbody> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> <i>Booléen</i> </td> <td class="attr_cellule attr_desc" data-label="Description"> <code>defer</code> a la valeur false par défaut, le fait de placer <code>defer</code> à l'intérieur de la balise le rendra à true </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/script#attr-defer' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://html.spec.whatwg.org/#attr-script-defer' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/whatwg.png" alt="HTML Living Standard" title="HTML Living Standard"></a></li><li><a href='https://caniuse.com/script-defer' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><script src="<i>url</i>" defer></script></code><br> <div id="01108" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-01108" class="codeView code inline" data-source="01108"><script src="js/script.js" defer></script></textarea> </div> <script> var cm01108=CodeMirror.fromTextArea(document.getElementById("text-01108"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> </tbody> </table> </section> </article> </div> <footer class="entry-footer"> </footer> </article> <article id="post-1099" class="post-1099 post type-post status-publish format-standard hentry category-attribut category-code_html"> <header class="entry-header"> <h2 class="entry-title"><a href="http://htmlcss.pamaq.com/async-script/" rel="bookmark">async-script</a></h2> <div class="entry-meta"> </div> </header> <div class="entry-content"> <article class="article_attribut article_titre attribut_async" data-parent=""> <h3 class="attr_title">async</h3> <section class="section_attribut section_description attribut_async"> Indique que le fichier saisie dans l’attribut <code>src</code> doit être téléchargé en parallèle de l’affichage de la page et exécuté aussitôt </section> <section class="section_attribut section_attention attribut_async"> <i class="fas fa-exclamation-triangle icon_attention" title="Attention"></i> Ne fonctionne qu'avec l'attribut <code>src</code> </section> <section class="section_attribut section_syntax attribut_async"> <i class="fas fa-chevron-circle-right icon_syntax" title="Syntax"></i> <code class='codeHTML'><script src="<i>url</i>" async></code> </section> <section class="section_attribut section_valeur attribut_async"> <table class="table_attribut"> <thead> <tr class="th"> <th class=”attr-date”>Valeur</th> <th class=”attr-desc”>Description</th> <th class=”attr-info”>Infos</th> </tr> </thead> <tbody> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> <i>Booléen</i> </td> <td class="attr_cellule attr_desc" data-label="Description"> <code>async</code> a la valeur false par défaut. Le fait de placer <code>async</code> à l'intérieur de la balise le rendra à true </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/script#attr-async' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://html.spec.whatwg.org/#attr-script-async' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/whatwg.png" alt="HTML Living Standard" title="HTML Living Standard"></a></li><li><a href='https://caniuse.com/script-async' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><script src="<i>url</i>" async></script></code><br> <div id="01099" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-01099" class="codeView code inline" data-source="01099"><script src="js/script.js" async></script></textarea> </div> <script> var cm01099=CodeMirror.fromTextArea(document.getElementById("text-01099"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> </tbody> </table> </section> </article> </div> <footer class="entry-footer"> </footer> </article> <article id="post-1093" class="post-1093 post type-post status-publish format-standard hentry category-attribut category-code_html"> <header class="entry-header"> <h2 class="entry-title"><a href="http://htmlcss.pamaq.com/crossorigin-script/" rel="bookmark">crossorigin-script</a></h2> <div class="entry-meta"> </div> </header> <div class="entry-content"> <article class="article_attribut article_titre attribut_crossorigin" data-parent=""> <h3 class="attr_title">crossorigin</h3> <section class="section_attribut section_description attribut_crossorigin"> Une demande cross-origin est une requête pour une ressource (feuilles de style, images, polices ou scripts…) située sur un autre serveur, un autre domaine.<br>Cette demande est gérée par CORS (Cross-Origin Resource Sharing) qui détermine si le navigateur est autorisé ou non à charger le contenu externe. </section> <section class="section_attribut section_conseil attribut_crossorigin"> <i class="far fa-thumbs-up icon_conseil" title="Conseil - Recommandation"></i> N'utilisez pas cet attribut si tous vos fichiers se situent sur votre serveur, votre domaine. </section> <section class="section_attribut section_syntax attribut_crossorigin"> <i class="fas fa-chevron-circle-right icon_syntax" title="Syntax"></i> <code class='codeHTML'><script src="<i>url</i>" crossorigin="<i>valeur</i>"></code> </section> <section class="section_attribut section_valeur attribut_crossorigin"> <table class="table_attribut"> <thead> <tr class="th"> <th class=”attr-date”>Valeur</th> <th class=”attr-desc”>Description</th> <th class=”attr-info”>Infos</th> </tr> </thead> <tbody> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> anonymous </td> <td class="attr_cellule attr_desc" data-label="Description"> <ul> <li>La demande cross-origin est envoyée sans identification et effectue une authentification HTTP de base</li> <li>Valeur par défaut</li> </ul> </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/script#attr-crossorigin' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://html.spec.whatwg.org/multipage/urls-and-fetching.html#attr-crossorigin-anonymous' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/whatwg.png" alt="HTML Living Standard" title="HTML Living Standard"></a></li><li><a href='https://caniuse.com/mdn-api_svgscriptelement_crossorigin' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><script src="<i>url</i>" crossorigin="anonymous"></script></code><br> <div id="01093" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-01093" class="codeView code inline" data-source="01093"><script src="js/script.js" crossorigin="anonymous"></script></textarea> </div> <script> var cm01093=CodeMirror.fromTextArea(document.getElementById("text-01093"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> use-credentials </td> <td class="attr_cellule attr_desc" data-label="Description"> Demande d'origine croisée sera envoyée avec les informations d'identification, les cookies et le certificat </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/script#attr-crossorigin' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://html.spec.whatwg.org/multipage/urls-and-fetching.html#attr-crossorigin-anonymous' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/whatwg.png" alt="HTML Living Standard" title="HTML Living Standard"></a></li><li><a href='https://caniuse.com/mdn-api_svgscriptelement_crossorigin' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/caniuse.png" alt="Can i use" title="Can i use"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><script src="<i>url</i>" crossorigin="use-credentials"></script></code><br> <div id="11093" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-11093" class="codeView code inline" data-source="11093"><script src="js/script.js" crossorigin="use-credentials"></script></textarea> </div> <script> var cm11093=CodeMirror.fromTextArea(document.getElementById("text-11093"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </td> </tr> </tbody> </table> </section> </article> </div> <footer class="entry-footer"> </footer> </article> <article id="post-1082" class="post-1082 post type-post status-publish format-standard hentry category-attribut category-code_html"> <header class="entry-header"> <h2 class="entry-title"><a href="http://htmlcss.pamaq.com/src-script/" rel="bookmark">src-script</a></h2> <div class="entry-meta"> </div> </header> <div class="entry-content"> <article class="article_attribut article_titre attribut_src" data-parent=""> <h3 class="attr_title">src</h3> <section class="section_attribut section_description attribut_src"> <ul> <li>Définit le lien vers un fichier javascript externe</li> <li>Très utile pour charger le même code javascript sur plusieurs pages</li> </ul> </section> <section class="section_attribut section_attention attribut_src"> <i class="fas fa-exclamation-triangle icon_attention" title="Attention"></i> L'intérieur de la balise <script> doit rester vide en cas d'utilisation de cet attribut </section> <section class="section_attribut section_syntax attribut_src"> <i class="fas fa-chevron-circle-right icon_syntax" title="Syntax"></i> <code class='codeHTML'><script src="<i>url</i>"></code> </section> <section class="section_attribut section_valeur attribut_src"> <table class="table_attribut"> <thead> <tr class="th"> <th class=”attr-date”>Valeur</th> <th class=”attr-desc”>Description</th> <th class=”attr-info”>Infos</th> </tr> </thead> <tbody> <tr> <td class="attr_cellule attr_valeur" data-label="Valeur" rowspan="2"> <i>url</i> </td> <td class="attr_cellule attr_desc" data-label="Description"> <ul> <li>L'url, le lien pointant vers un fichier javacript (format js)</li> <li>En valeur absolu vers une ressource externe</li> <li>Ou en valeur relative pour un élément interne</li> </ul> </td> <td class="attr_cellule attr_info" data-label="Infos" rowspan="2"> <ul class="link_flex"><li><a href='https://developer.mozilla.org/fr/docs/Web/HTML/Element/script#attr-src' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/mozilla.png" alt="MDN Web Docs" title="MDN Web Docs"></a></li><li><a href='https://html.spec.whatwg.org/multipage/scripting.html#attr-script-src' target='_blank'><img src="http://htmlcss.pamaq.com/wp-content/uploads/2021/09/whatwg.png" alt="HTML Living Standard" title="HTML Living Standard"></a></li></ul> </td> </tr> <tr> <td class="attr_cellule attr_syntax" data-label="Syntax / exemple"> <code class="codeHTML codeMini"><script src="<i>url</i>"></script></code><br> <ul> <li> <div id="010820" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-010820" class="codeView code inline" data-source="010820"><script src="http://htmlcss.pamaq.com/js/script.js"></script></textarea> </div> <script> var cm010820=CodeMirror.fromTextArea(document.getElementById("text-010820"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </li> <li> <div id="010821" class="codeView codeMini"> <div class="codeContent"> <textarea id="text-010821" class="codeView code inline" data-source="010821"><script src="js/script.js"></script></textarea> </div> <script> var cm010821=CodeMirror.fromTextArea(document.getElementById("text-010821"), { lineNumbers: false, mode: "text/html", readOnly: "true", matchBrackets: false }) </script> </div> </li> </ul> </td> </tr> </tbody> </table> </section> </article> </div> <footer class="entry-footer"> </footer> </article> <nav class="navigation posts-navigation" aria-label="Publications"> <h2 class="screen-reader-text">Navigation des articles</h2> <div class="nav-links"><div class="nav-previous"><a href="http://htmlcss.pamaq.com/category/code_html/page/8/" >Articles plus anciens</a></div><div class="nav-next"><a href="http://htmlcss.pamaq.com/category/code_html/page/6/" >Articles plus récents</a></div></div> </nav> </main> </div> </div> <footer id="colophon" class="site-footer"> <div class="site-info"> <a href="https://wordpress.org/">Proudly powered by WordPress</a> <span class="sep"> | </span> Theme: htmlcss by <a href="http://htmlcss.pamaq.com">Vincent</a>. </div> </footer> </div> <script type='text/javascript' src='http://htmlcss.pamaq.com/wp-content/themes/htmlcss/js/navigation.js?ver=20151215' id='htmlcss-navigation-js'></script> <script type='text/javascript' src='http://htmlcss.pamaq.com/wp-content/themes/htmlcss/js/skip-link-focus-fix.js?ver=20151215' id='htmlcss-skip-link-focus-fix-js'></script> <script type='text/javascript' src='http://htmlcss.pamaq.com/wp-content/themes/htmlcss/js/jquery-migrate.min.js?ver=5.9.10' id='jquery-migrate-js'></script> </body> </html>