Yannick François
90 lines
4.2 KiB
HTML
90 lines
4.2 KiB
HTML
<!DOCTYPE html>
|
||
<html lang="fr">
|
||
<head>
|
||
<meta charset="utf-8">
|
||
<title>Dimanche 3 octobre 2021 - Elsif.fr</title>
|
||
<meta name="DC.title" content="elsif.fr, site de Yannick François aka yaf (ou ya_f)."/>
|
||
<meta name="description" content="Le site de Yannick François. Développeur Senior, Responsable Produit, Pédagogue. Je travail chez Scopyleft"/>
|
||
<meta name="keywords" content="code, développement, programmation, apprentissage, apprendre, lean, agile, logiciel, tdd, objet, refactoring, libre, creative commons, linux, unix"/>
|
||
<meta name="author" content="Yannick François, https://elsif.fr"/>
|
||
<meta name="designer" content="Yannick François, https://elsif.fr"/>
|
||
<meta name="geo.placename" content="Poissy, Ile de france, France"/>
|
||
<meta name="robots" content="index,follow" />
|
||
<meta name="language" content="French" />
|
||
<meta name="HandheldFriendly" content="True" />
|
||
<meta name="MobileOptimized" content="320" />
|
||
<meta name="viewport" content="width=device-width, initial-scale=1.0, user-scalable=0, minimum-scale=1.0, maximum-scale=1.0" />
|
||
<link rel="index" title="Yannick François / Développeur / Pédagogue" href="index.html" />
|
||
<link rel="alternate" type="application/rss" href="/feed.xml" title="elsif.fr/feed" />
|
||
<style>
|
||
body {
|
||
font-size:16pt;
|
||
max-width:42rem;
|
||
min-width: 18rem;
|
||
margin: 1em;
|
||
color: black;
|
||
background: white;
|
||
font-family: Palatino, "Palatino Linotype", "Palatino LT STD", "Book Antiqua", Georgia, serif;
|
||
}
|
||
a { color: darkred; }
|
||
a:hover { background: gold; }
|
||
a:visited, a:active { color: dimgrey; }
|
||
nav { text-align:center; font-size:smaller; padding: 0; margin: 0; }
|
||
nav li { list-style-type: none; }
|
||
h2 > a, h2 > a:active, h2 > a:visited { color: lightgrey; text-decoration:none;}
|
||
h2 > a:hover { color: black; text-decoration:underline }
|
||
|
||
@media (max-width: 1000px) { #portrait {display:none;} }
|
||
</style>
|
||
</head>
|
||
<body>
|
||
<article>
|
||
<h1>Dimanche 3 octobre 2021</h1>
|
||
<blockquote>
|
||
<p>HTML tips you won’t see in most tutorials.</p>
|
||
</blockquote>
|
||
<p>https://twitter.com/denicmarko/status/1443890483453956097 Un fil Twitter à propos de tips HTML assez intéressant.</p>
|
||
<blockquote>
|
||
<ol type="1">
|
||
<li>The <code>loading=lazy</code> attribute</li>
|
||
</ol>
|
||
<p>You can use the <code>loading=lazy</code> attribute to defer the loading of the image until the user scrolls to them.</p>
|
||
</blockquote>
|
||
<blockquote>
|
||
<ol start="2" type="1">
|
||
<li>Use the <code><datalist></code> element to create native HTML autocomplete.</li>
|
||
</ol>
|
||
</blockquote>
|
||
<p>La page à propos de <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/datalist">datalist sur MDN</a> semble montrer que c’est disponible sur tout les navigateurs. Comment ces balises se comporte sur un vieu navigateur ? Je pense à l’éco-conception…</p>
|
||
<blockquote>
|
||
<ol start="5" type="1">
|
||
<li>Use <code><input type="reset"></code> to create clear button for your forms.</li>
|
||
</ol>
|
||
</blockquote>
|
||
<blockquote>
|
||
<ol start="11" type="1">
|
||
<li>HTML Accordion</li>
|
||
</ol>
|
||
You can use the <code>details</code> element to create a native HTML accordion.
|
||
<details>
|
||
<summary> Click me to see more details </summary>
|
||
<p>
|
||
Details shown after click on the <code>summary</code> element
|
||
</p>
|
||
</details>
|
||
</blockquote>
|
||
<p>Cette balise n’est pas suporté par le vieux internet explorer d’après la page <a href="https://developer.mozilla.org/en-US/docs/Web/HTML/Element/details">details sur MDN</a></p>
|
||
<blockquote>
|
||
<ol start="12" type="1">
|
||
<li><code>mark</code> tag</li>
|
||
</ol>
|
||
<p>You can use the <code><mark></code> tag to highlight text.</p>
|
||
</blockquote>
|
||
<p>Ça me permettra d’arrêter d’utiliser <code><em></code> ? Mais comment l’utiliser dans Markdown ? En l’incrustant comme balise dans le texte sans doute.</p>
|
||
<hr />
|
||
<p><a href="https://webzine.puffy.cafe/issue-1.html">Le premier numéro d’un nouveau webzine à propos d’OpenBSD</a> !</p>
|
||
<p>J’ai bien envie de tenter OpenBSD :)</p>
|
||
</article>
|
||
</body>
|
||
</html>
|