384400 384400

Comment générer une table des matières et des liens hypertextes internes avec JavaScript ?

Constitution du 4 octobre 1958

Pour des développements ultérieurs, nous avons mis au format Html le texte de la Constitution du 4 octobre 1958 disponible sur [La-Constitution] (https://github.com/legifrance/La-Constitution/blob/master/Constitution%20du%204%20octobre%201958.txt) et créé par [Légifrance] (http://github.com/legifrance).

Ce dépôt de la constitution française a été légèrement amélioré, par exemple :

Etat a été remplacé par État.
Le préposition A (en capitale) a été remplacé par À.
n° a été remplacé par no pour se conformer à l'usage typographique.
oeuvre a été remplacé par œuvre.
Président de la République a été remplacé par président de la République, conformément à l'usage typographique.

Comment produire une lettre professionnelle en Html ?

Avec quelques rudiments en Html, grâce à un bloc-notes comme [Notepad++] (https://notepad-plus-plus.org/fr/) et à un navigateur, il peut-être intéressant de générer une lettre professionnelle ou commerciale au format A4 à imprimer. À l'heure où les outils bureautiques deviennent complexes et chers, à l'heure où enfle la taille des documents à enregistrer, notre solution se veut frugale et universelle.

Le modus operandi est le suivant (plus long à décrire qu'à exécuter !) :

lancement du bloc-notes ;
lancement du navigateur ;
ouverture du fichier avec le bloc-notes et le navigateur ;
rédaction du texte ;
impression virtuelle du document (c'est le texte final) au format Pdf ;

A compléter ultérieurement

Comment afficher une gouttière avec le module Flexbox Layout ?

[CSS Flexible Box Layout Module Level 1] (https://www.w3.org/TR/css-flexbox-1/) permet facilement de disposer un contenu sous formes de colonnes, mais ne prend pas en charge les gouttières.

Une gouttière rend le contenu plus facile à lire.

Réduite à des dimensions minimales, la gouttière remplace un trait horizontal (ou vertical). Il suffit d'attribuer un arrière-plan de couleur au conteneur principal et de donner une marge aux éléments qui suivent, comme le montre le fichier gutter-a.hml.

Pour dessiner un trait de séparation, il existe une solution encore plus simple : attribuer une bordure aux conteneurs, comme le montre le fichier gutter-b.html.

Comment utiliser le module Multi-column Layout ?

[CSS Multi-column Layout Module] (https://www.w3.org/TR/css3-multicol/) permet de disposer un contenu sous formes de colonnes.

Les autres techniques, comme [CSS Flexible Box Layout Module Level 1] (https://www.w3.org/TR/css-flexbox-1/), les tableaux et les grilles, autorisent la création de colonnes. Cependant, ces possibilités sont satisfaisantes exclusivement quand le contenu est statique. Si nous écrivons un livre, le contenu sera immuable et les modifications mineures. Si nous publions un journal, le contenu sera imprévisible !

La mise en page avec de multiples colonnes présente surtout un intérêt pour les écrans larges : les lignes trop longues découragent le lecteur et sont inesthétiques.

À l'heure où nous rédigeons ces lignes, le support des navigateurs est insuffisant : il nécessite le recours à des propriétés préfixées pour Google Chrome, Mozilla Firefox, Safari et Opera, comme l'indique [Can I use] (http://caniuse.com/#feat=multicolumn).

	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8" />
	<title>Liste des professions</title>
	</head>
	<body>
	<form>
	<label>Profession
	<select>

	<!DOCTYPE html>
	<html lang="fr">
	<head>
	<meta charset="utf-8" />
	<title>Visualisateur de glyphes</title>
	<style>
	@font-face {
	font-family: 'My Sans Serif font';
	src: url('source/SourceSansPro-Regular.ttf') format('truetype');
	}

	<!DOCTYPE html>
	<html>
	<head>
	<meta charset="utf-8">
	<title>Aligner horizontalement deux titres de tailles différentes</title>
	<link rel="stylesheet" href="style.css">
	</head>
	<body>
	<div class="flex">
	<div>

	var addEvent = function(evt, handler) {
	if (window.addEventListener) {
	document.addEventListener(evt, handler, false);
	} else if (window.attachEvent) {
	document.attachEvent('on' + evt, handler);
	}
	};
	var removeEvent = function(evt, handler) {
	if (window.removeEventListener) {
	document.removeEventListener(evt, handler, false);