HTML5 : la balise PICTURE

Il est absurde d’afficher sur l’écran minuscule d’un smartphone une image haute résolution (donc une image lourde).
Ces images qui pèsent plus d’un demi méga doivent être réservées aux grands écrans et encore si elles sont affichées « plein écran ».
Grâce à la balise PICTURE  de HTML 5  il est possible de changer d’image en fonction de la taille de l’écran.

Lire la suite

 

Publié dans HTML, images | Laisser un commentaire

Le pangolin

Le Pangolin est probablement un des transmetteurs du virus à l’origine de l’actuelle pandémie. Cela a été confirmé par une étude publiée fin mars dans le journal scientifique Nature.

Le pangolin, qui compte quatre espèces vivant dans les forêts d’Asie du Sud-Est et quatre autres en Afrique, est aussi le mammifère le plus braconné au monde. Selon une ONG un million d’individus auraient été chassés au cours des dix dernières années. Les Chinois en sont les principaux acheteurs. Ils consomment la viande de l’animal, mais utilisent aussi ses écailles, riches en kératine, en raison de sa prétendue vertu thérapeutique. La famille est menacée  d’extinction.

Avec son corps recouvert d’écailles triangulaires l’animal ressemble à une grosse pomme de pin. Attaqué il se met en boule. Le Pangolin se nourrit de fourmis et de termites qu’il capture avec une très longue langue visqueuse pour piéger les insectes. Il fouille les termitières et fourmilières avec ses griffes acérées. 

Publié dans biologie aquatique | Laisser un commentaire

Des poissons étonnants

Dans cet article je vous présente des poissons surprenants et que vous ne verrez probablement jamais en plongée. En effet ils sont très rares OU ils fréquentent des profondeurs inaccessibles au plongeur bouteille OU leur distribution est réduite à une zone reculée OU ils viennent de disparaitre OU vous passez à côté sans les voir …
Ils sont étonnants pour diverses raisons. Il y a les poissons géants ; il y a les monstres et ceux qui ressemblent à tout sauf au poisson type.

Lire la suite

Publié dans biologie aquatique | Laisser un commentaire

Feuille de style pour impression

Certains internautes en particulier les plus âgés veulent souvent imprimer une ou des pages d’un site.
Cette opération ne doit pas se traduire pour l’utilisateur par l’impression d’un nombre inconsidéré de feuilles et une consommation importante d’encre.
Beaucoup de sites proposent une version imprimable de certaines pages sous forme d’un fichier pdf. C’est une solution dépassée car le CSS est désormais capable de gérer une mise en page de qualité en vue de l’impression. Donc c’est désormais inutile et coûteux (en terme de temps de développement) de « doubler » chaque page web de son équivalent pdf.
Il suffit désormais de prévoir une feuille de style pour l’impression !

Lire la suite

 

Publié dans CSS, HTML | Laisser un commentaire

Numérotation automatique des balise titres (h1 à h6)

Si vous maitrisez l’emploi d’un traitement de textes vous savez que l’on dispose d’une fonctionnalité très intéressante : la numérotation automatique des titres. Par exemple les titres de niveau 1 sont précédés d’un chiffre romain en majuscules (I, II, …), les titres de niveau 2 sont précédés d’une lettre majuscule (A,B, …) et les titres de niveau 3 d’un chiffre arabe (1,2,…).

Ou bien vous optez pour la numérotation hiérarchique décimale. Ce qui donne alors :

1-Titre de niveau 1
	11-Titre de niveau 2
	12 -Titre de niveau 2
2-Titre de niveau 1
	21-Titre de niveau 2
	22-Titre de niveau 2
		221 -Titre de niveau 3
	...

Bonne nouvelle : c’est désormais possible dans une page Web d’obtenir la numérotation automatique des titres (balises h1 à h6) grâce à CSS.

Lire la suite

Publié dans CSS, HTML | Laisser un commentaire

Créer un menu « hamburger »

Ces trois barres horizontales sont omniprésentes : jeux vidéo, applications, sites internet, logiciel, etc.
Lorsque vous les voyez, vous savez immédiatement qu’il s’agit d’un bouton vous donnant accès à un menu.
Sur un petit écran les pixels sont précieux. le menu « hamburger » est une bonne solution.

Donc par défaut un menu ‘hamburger’ est masqué.
Si clic sur l’icône ‘hamburger’ alors le menu s’affiche.
Nouveau clic sur l’image ‘hamburger’ et alors le menu disparait.

Lire la suite

Publié dans CSS | Laisser un commentaire

CSS3 : révolution dans le positionnement

 

Le positionnement jusqu’à la version 2 était le point faible de CSS.

Excellent nouvelle : CSS3 introduit deux nouvelles spécifications : flexbox & grid-layout.
L’outil flexbox (boites flexibles) est déjà bien implémenté sur les navigateurs.
Par contre l’outil grid-layout (positionnement en grille) n’est pas intégré dans un navigateur ; devinez lequel …

Ces deux nouveaux outils se complètent parfaitement.
L’outi « grid-layout » permet de construire la structure générale de la page alors que l’outil « flexbox » n’est vraiment à l’aise que dans une seule direction …
Pour prendre une exemple l’outil « grid-layout » sera utilisé pour disposer les grandes divisions de la page (les boites header, nav, article, aside, footer) tandis que l’outil « flexbox » permettra de disposer les différents DIV contenus dans la division ARTICLE, par exemple.

Lire la suite

Publié dans CSS | Tagué | Laisser un commentaire