Apprendre à coder html5, css3, javascript

Affichage des articles dont le libellé est links. Afficher tous les articles
Affichage des articles dont le libellé est links. Afficher tous les articles

lundi 11 novembre 2019

Les liens dans l'en-tête


Il y a différents liens dans l'en-tête du document HTML5 (head).

Les Liens extérieurs:

L'élément de lien <link> associe le document HTML actuel à une ressource externe , il y a plusieurs 

ressources extérieures, donnant exemples comme document  de feuilles de style css ou une 

bibliothèque ou image ico etc.

La tâche la plus courante de l'élément lien <link> est de connecter une page web à une feuille de

style externe et associe à la page à une icône que le navigateur l'affiche dans les signes et dans le 

champ d'adresse .

L'élément <link> contient les attributs suivants : rel="",  href=""

L'attribut rel =" " : indique la relation entre le document HTML actuel et la ressource liée ,

examples:  rel= "stylesheet" , rel="icon", rel="editURL", rel="search" ,rel="prev" , rel="license".

L'attrubut href="" :  href requis porte l'URL (un localisateur de ressources uniforme)  de la

ressource liée ,

examples: href="/css/styles.css" , href="https://feeds.feedburner.com/example"

href="/favicon.ico", etc ..
 
Il y a aussi l'attribut type="" , ce dernier n'est pas nécessaire à présent, rarement utilisé .

On n'a pas toujours besoin de déclarer le type de contenu pour chaque ressource.

Les informations de l'attribut type sont envoyées automatiquement par le serveur web ou intégrées 

au fichier lui-même.

examples : type="text/html",type="stylesheet",type="image/ico" ,etc ..


links in head
les liens dans l'entete

Le nombre d'éléments de lien <link> que vous pouvez inclure dans l'en-tête d'un document HTML

est illimité, par exemple , nous pouvons créer des liens vers différentes feuilles de style pour 

différents supports ou plusieurs icônes .

Les deux éléments suivants de liaison reliant le document HTML à deux ressources externes 

différentes :

 <head>

<link  rel="stylesheet"  type="text/css"  href="/css/styles.css">

<link  rel="icon"  type["image/ico"  href="/favicon.ico"> 

 </head>



Type de support (Media type) :


L'attribut de type facultatif de l'élément lien (link) indique le type de média internet de la ressource 

liée . ce type de contenu est également appelé type de contenu ou type MIME 

( Multipurpose Internet Mail Extensions, ces types de médias ont été définis à l'origine pour être 

utilisé dans le courrier électronique , mais ensuite été adoptés pour d'autres applications internet , y 

compris le web ).

Différents types de fichiers sont servis et gérés de différentes manières .

les fichiers texte sont très différents des fichiers images et les deux sont différents des fichiers vidéos

ou des fichiers applications .

Le type de média internet est un identifiant en deux parties composées d'un type et d'un sous-type ,

séparés par une barre oblique , indiquant le type de fichier traité par le navigateur afin que celui-ci

puisse traiter les données en conséquence.Le type de média pour les fichiers CSS est un text/css , ce 

qui indique que la feuille de style est un fichier texte écrit en langage CSS.

Il s'agit de la valeur de type que vous etes le plus suscibtible de rencontrer dans un élément de lien.

Les autres fichiers multimédia ont leurs propres types de contenu.

Tels que image/jpeg pour les graphiques jpeg et audio/mpeg pour les fichiers audio mp3 .

L'attribut type peut apparaitre sur d'autres éléments que le lien par exemple comme <input>.

Type de support différent:

Lorsque l'élément de lien (link) est lié à une feuille de style css , l'attribut média facultatif peut 

indiquer le support auquel cette feuille de style est destinée.

Donc on peut facilement personnaliser mise à jour et la conception de notre site pour différents 

médias . 

On peut écrire de feuilles de style cs distinctes , la première pour l'afficher sur un écran d'ordinateur et la deuxième pour l'utiliser lorsque la page est imprimée.



<link rel="stylesheet" href="/css/screen-styles.css" media="screen">

<link rel="stylesheet" href="/css/screen-styles.css" media="print">     


On peut aussi inclure ou ajouter plusieurs type de support dans un seul attribut de support , qui sont 

séparés par des virgules.

<link rel="stylesheet" href="/css/screen-styles.css" media="screen,projection,tv">