Ficha de revisão: Introduction aux fondamentaux du Web

📋 Plan du Cours

  1. Historique et concepts fondamentaux d'Internet
  2. Architecture réseau et protocoles TCP/IP
  3. Architecture client/serveur et protocoles de communication
  4. Structure et syntaxe des URL
  5. Fonctionnement du DNS et rôle des ports réseau
  6. Principes et évolution du langage HTML
  7. Structure des balises HTML, attributs, commentaires et entités
  8. Organisation d'une page HTML : balises <html>, <head> et <body>
  9. Syntaxe CSS : sélecteurs, propriétés et mise en place
  10. Gestion des couleurs en CSS : formats hexadécimal, rgb, hsl et transparence
  11. Sélecteurs avancés en CSS : pseudo-éléments et sélecteurs d'attributs
  12. Formulaires HTML : balises <form>, <input>, attributs et éléments associés

📖 1. Historique et concepts fondamentaux d'Internet

🔑 Notions clés & Définitions

  • Le serveur : Un logiciel serveur installé sur une machine traite les requêtes des clients.
  • Internet : Un réseau mondial issu du réseau ARPANET initial constitué en 1969 avec 4 ordinateurs connectés, qui a évolué avec l'adoption des protocoles TCP/IP et l'apparition du World Wide Web.
  • World Wide Web Consortium (W3C) : Une organisation fondée en 1994 par Tim Berners Lee pour standardiser les technologies du Web.

📝 Points essentiels

  • Le réseau ARPANET initial, constitué en 1969, comprenait 4 ordinateurs connectés, et en 1973, 35 machines y étaient reliées.
  • En 1990, Tim Berners Lee a proposé l'idée du World Wide Web au CERN, marquant une étape clé dans l'évolution d'Internet.
  • Le W3C a été fondé en 1994 pour standardiser le Web, après la proposition de Berners Lee en 1990.

💡 À retenir

Comprendre l'évolution historique d'Internet, depuis le réseau ARPANET jusqu'à la création du W3C en 1994, permet de saisir ses fondations techniques et organisationnelles.

📖 2. Architecture réseau et protocoles TCP/IP

🔑 Notions clés & Définitions

  • HTML : Un langage de balisage utilisé pour structurer des pages web, dont le code source est interprété par un navigateur pour afficher le contenu.
  • Couche réseau-hôte : La couche qui comprend la carte réseau (Ethernet ou Wifi) et ses pilotes, assurant la communication physique et la gestion des interfaces réseau.
  • Couche internet : La couche responsable du routage des paquets de données entre réseaux, notamment à travers le protocole ICMP (Internet Control Message Protocol).

📝 Points essentiels

  • La couche réseau-hôte comprend la carte réseau et ses drivers, qui assurent la communication physique.
  • La couche transport régule les flux de données avec les protocoles TCP et UDP.
  • La couche application regroupe les programmes utilisateurs comme navigateur Web, FTP, Telnet, Ping, POP, SMTP.

💡 À retenir

La couche réseau-hôte comprend la carte réseau et ses drivers, qui assurent la communication physique.

📖 3. Architecture client/serveur et protocoles de communication

🔑 Notions clés & Définitions

  • Content : Codes attachés (style, javascript) Les informations ne sont pas visibles directement dans le rendu du navigateur (sauf le titre) mais sont visibles dans le code source <meta name
  • POP et IMAP : La réception de messages électroniques.

📝 Points essentiels

  • Le protocole HTTP est utilisé pour les documents hypertextes, incluant textes, images, vidéos et sons.
  • Le protocole FTP sert au transfert de fichiers entre client et serveur.
  • Le protocole SMTP est utilisé pour l’envoi de messages électroniques.
  • Les protocoles POP et IMAP sont utilisés pour la réception des messages électroniques.
  • La réception de courrier : Le destinateur final récupère par POP/IMAP son courrier depuis son serveur qui reçoit les messages du serveur de l'expéditeur Le navigateur (Webmail) peut représenter une alternative au client de messagerie.
  • L’émission de courrier : Le client utilise SMTP pour envoyer des messages au serveur qui transmettra au serveur du destinataire final.

💡 À retenir

Le protocole HTTP est utilisé pour les documents hypertextes, incluant textes, images, vidéos et sons.

📖 4. Structure et syntaxe des URL

🔑 Notions clés & Définitions

  • Png" alt : Png" alt="logo html5" height="120" width="120"> <img src
  • Jpeg) : Format d’image adapté aux photos et illustrations complexes, utilisant une compression avec perte et supportant des millions de couleurs.
  • Adresse IP : Identifiant numérique unique attribué à chaque ordinateur sur un réseau, permettant de localiser cet ordinateur.
  • Nom de domaine : Nom de Domaine / Nom de machine : nom symbolique d’une machine sur Internet (ex.

📝 Points essentiels

  • Le nom de domaine est un nom symbolique d’une machine, comme ent.univ-st-etienne.fr, tandis que l’adresse IP est un identifiant numérique unique.
  • Le port est une valeur numérique qui identifie un programme ou service spécifique, comme 80 pour HTTP ou 21 pour FTP.

💡 À retenir

Comprendre la composition d’une URL est fondamental pour localiser et accéder aux ressources sur Internet.

📖 5. Fonctionnement du DNS et rôle des ports réseau

🔑 Notions clés & Définitions

  • Target : Attribut HTML qui spécifie où ouvrir le document lié, par exemple dans un nouvel onglet ou la même fenêtre.

📝 Points essentiels

  • Le DNS est un service qui fait la correspondance entre un nom de domaine et une adresse IP.
  • Chaque programme ou service réseau utilise un port unique pour identifier les communications, par exemple FTP utilise le port 21.
  • Le DNS permet d’utiliser des noms symboliques plus lisibles que les adresses IP numériques.

💡 À retenir

Le DNS et les ports réseau sont essentiels pour traduire les noms en adresses et diriger les communications vers les bons services.

📖 6. Principes et évolution du langage HTML

🔑 Notions clés & Définitions

  • Class : Un attribut global en HTML qui permet d'associer un ou plusieurs éléments à une catégorie commune, facilitant l'application de styles CSS ou de scripts JavaScript.
  • Title : Un attribut global en HTML qui fournit une information supplémentaire affichée sous forme d'infobulle lors du survol de l'élément par la souris.
  • Rowspan : Un attribut utilisé dans les tableaux HTML pour fusionner verticalement plusieurs cellules, en étendant une cellule sur plusieurs lignes.
  • Langage de balisage : Un type de langage informatique qui utilise des balises pour structurer et décrire le contenu d'un document, sans comporter de logique de programmation.

📝 Points essentiels

  • HTML est un langage de balisage utilisé pour structurer les pages web, distinct d’un langage de programmation.
  • HTML a évolué depuis 1991 avec des versions majeures : HTML 2.0 (1995), HTML 3.2 (1997), HTML 4.01 (1999), XHTML (2000) et HTML5 (2014).
  • HTML5 introduit des balises sémantiques et de nouvelles fonctionnalités pour le Web moderne.

💡 À retenir

Connaître l’évolution d’HTML permet de comprendre les standards actuels et les bonnes pratiques de structuration web.

📖 7. Structure des balises HTML, attributs, commentaires et entités

🔑 Notions clés & Définitions

  • Vert : Nom d'une couleur simple en CSS correspondant à une teinte verte standard utilisée pour définir la couleur du texte ou du fond.
  • Color : Css"> <link rel="stylesheet" href
  • Blanc : Nom d'une couleur simple en CSS correspondant à la couleur blanche, souvent utilisée pour le texte ou le fond.

📝 Points essentiels

  • Les balises HTML délimitent les éléments, qui peuvent être de zone (ouvrante/fermante) ou ponctuelles (sans contenu).
  • Les attributs, associés aux balises ouvrantes, définissent des propriétés comme src ou alt pour les images.
  • Les entités HTML, telles que < ou &, permettent d’afficher des caractères spéciaux dans la page.
  • En HTML5, le slash de fin dans les balises ponctuelles n’est plus obligatoire, simplifiant la syntaxe.
  • Il existe d'autres entités 24 La grammaire HTML On peut définir 5 règles : définir une balise de zone définir une balise ponctuelle paramétrer une balise à l'aide d'attributs imbriquer des balises ajouter des commentaires Les espaces typographiques ne sont pas prises en compte en HTML sauf pour séparer 2 mots 25 Structure d'une page HTML 26 Hello world Créer un fichier avec l'extension .

💡 À retenir

Maîtriser la syntaxe des balises, attributs, commentaires et entités est indispensable pour écrire un code HTML valide et lisible.

📖 8. Organisation d'une page HTML : balises <html>, <head> et <body>

🔑 Notions clés & Définitions

  • <html> : balise qui encadre l’ensemble du contenu d’une page HTML, débutant la structure et indiquant au navigateur qu’il s’agit d’un document HTML. Elle doit toujours commencer la page et se terminer par </html>.
  • <head> : zone située à l’intérieur de <html> qui contient les métadonnées de la page, c’est-à-dire les informations caractéristiques qui ne sont pas directement affichées par le navigateur. Elle inclut notamment l’encodage, le titre, et d’autres ressources ou métadonnées.
  • <body> : zone de contenu visible par le navigateur, regroupant tout ce qui sera affiché : texte, images, liens, etc.

📝 Points essentiels

  • Une page HTML commence toujours par la balise <html> et se termine par </html>.
  • La balise <head> contient les métadonnées, notamment l’encodage avec <meta charset="utf-8"> et le titre avec <title>Titre</title>. Elle peut aussi contenir d’autres informations comme l’auteur ou des liens vers des ressources (CSS, scripts).
  • La balise <head> ne contient pas d’informations visibles directement dans le rendu du navigateur, sauf le titre qui apparaît dans l’onglet.
  • La balise <body> contient tout le contenu affiché par le navigateur, comme le texte, les images, les liens, etc.
  • La structure de la page HTML5 introduit des balises sémantiques pour organiser le contenu : <section>, <article>, <header>, <footer>, <aside>, <nav>.
  • Les balises sémantiques permettent de définir la fonction de chaque partie de la page pour une meilleure organisation et compréhension.

💡 À retenir

La structure fondamentale d’une page HTML repose sur l’encadrement par <html>, la séparation des métadonnées dans <head> et du contenu visible dans <body>. Comprendre cette organisation est essentiel pour structurer correctement une page web.

📖 9. Syntaxe CSS : sélecteurs, propriétés et mise en place

🔑 Notions clés & Définitions

  • Propriétés CSS : Des caractéristiques définissant l'apparence visuelle des éléments HTML, exprimées sous la forme propriété: valeur; dans une règle CSS.
  • Mise en place : Les différentes méthodes permettant d'appliquer des règles CSS à une page HTML, incluant l'intégration directe dans le code HTML ou l'utilisation de fichiers externes.

📝 Points essentiels

  • Les sélecteurs de base incluent universel (*), nom de balise, identifiant (#id), classe (.class) et combinaisons simples.
  • La méthode recommandée est l’utilisation d’un fichier CSS externe pour séparer contenu et présentation.

💡 À retenir

Les sélecteurs de base incluent universel (*), nom de balise, identifiant (#id), classe (.class) et combinaisons simples.

📖 10. Gestion des couleurs en CSS : formats hexadécimal, rgb, hsl et transparence

🔑 Notions clés & Définitions

  • Font : Un ensemble de propriétés CSS qui définissent le style, la taille, la graisse et la famille d'un texte.
  • Propriété opacity : Une propriété CSS qui règle la transparence globale d’un élément avec une valeur numérique comprise entre 0.0 (transparent) et 1.0 (opaque).

📝 Points essentiels

  • Les couleurs peuvent être définies en hexadécimal sur 3 (#f00) ou 6 (#ff0000) chiffres représentant rouge, vert, bleu.
  • Les fonctions rgb() utilisent des valeurs de 0 à 255 pour chaque couleur primaire.
  • Les fonctions hsl() définissent la couleur par teinte (0-360°), saturation et luminosité en pourcentage.
  • Les variantes rgba() et hsla() ajoutent un canal alpha pour la transparence (0.0 à 1.0).
  • La propriété opacity permet de régler la transparence globale d’un élément.
  • Gère la transparence et les animations.

💡 À retenir

Les couleurs peuvent être définies en hexadécimal sur 3 (#f00) ou 6 (#ff0000) chiffres représentant rouge, vert, bleu.

📖 11. Sélecteurs avancés en CSS : pseudo-éléments et sélecteurs d'attributs

🔑 Notions clés & Définitions

  • Margin : (top) (right/left) (bottom);
  • Padding : (top) (right/left) (bottom);

📝 Points essentiels

  • Les pseudo-éléments ::before et ::after permettent d’ajouter du contenu avant ou après un élément via la propriété content.
  • Les pseudo-éléments ::first-line et ::first-letter s'appliquent respectivement à la première ligne ou lettre d’un texte.
  • Les sélecteurs d’attributs ciblent les éléments selon la présence ou la valeur d’un attribut, avec des opérateurs comme =, *=, ^=, $=.

💡 À retenir

Les sélecteurs avancés, incluant les pseudo-éléments et les sélecteurs d’attributs, offrent une puissance de ciblage fine pour styliser dynamiquement le contenu sans changer la structure HTML.

📖 12. Formulaires HTML : balises <form>, <input>, attributs et éléments associés

🔑 Notions clés & Définitions

  • Value : Attribut HTML qui associe une valeur à une donnée identifiée dans un formulaire.
  • Name : Attribut HTML permettant d’identifier une donnée dans un formulaire, essentiel pour la récupération des données côté serveur.
  • Disabled : Attribut HTML qui désactive un champ de formulaire, empêchant toute saisie ou modification et excluant la donnée lors de l’envoi du formulaire.

📝 Points essentiels

  • Les attributs permettent de contrôler la saisie : required (obligatoire), disabled (désactivé), readonly (lecture seule), maxlength (longueur maximale), pattern (format attendu).
  • La balise <form> encadre un formulaire et utilise les attributs action (page de traitement) et method (GET ou POST).

💡 À retenir

Connaître les éléments et attributs des formulaires HTML est indispensable pour créer des interfaces utilisateur interactives et validées.

🧩 Compléments de couverture

  1. Détail source à réviser : 1 Table des matières 1. Internet 2. HTML 3. CSS 4. Les formulaires 2 Internet Historique Concepts de base 3 Chronologie 1/2 Historique 1969 : Le réseau ARPANET initial constituée de 4 ordinateurs (UCLA, Stanford Research (Source: "1 Table des matières 1. Internet 2. HTML 3. CSS 4. Les formulaires 2 Internet Historique Concepts de base 3 Chronologie 1/2 Historique 1969 : Le réseau ARPANET initial constituée de 4 ordinateurs (UCLA, Stanford Research Institute, Santa Barbara, Salt Lake City ) est fonctionnel. 1973 : 35 machines connectées sur ARPANET 1975 : TCP + IP + UDP 1984 :")
  2. Détail source à réviser : » rejeté le 5 janvier 2016 4 Chronologie 2/2 Historique 1990 : Tim Berners Lee du CERN propose l'idée du World Wide Web 1993 : Premier navigateur Mosaic 1994 : Création de Yahoo! 1994 : Tim Berners Lee fonde le World Wid (Source: "» rejeté le 5 janvier 2016 4 Chronologie 2/2 Historique 1990 : Tim Berners Lee du CERN propose l'idée du World Wide Web 1993 : Premier navigateur Mosaic 1994 : Création de Yahoo! 1994 : Tim Berners Lee fonde le World Wide Web Consortium (W3C) 5 Concepts de base Réseaux Architecture client/serveur URL 6 Le réseau Protocoles TCP/IP : couche réseau-hôte :")
  3. Détail source à réviser : Datagram Protocol) couche application : programmes utilisateurs tel que navigateur Web, FTP, Telnet, Ping, POP, SMTP, … 7 L'architecture client/serveur La notion de client/serveur : mode de communication entre au moins d (Source: "Datagram Protocol) couche application : programmes utilisateurs tel que navigateur Web, FTP, Telnet, Ping, POP, SMTP, … 7 L'architecture client/serveur La notion de client/serveur : mode de communication entre au moins deux ordinateurs l’un ou les uns, qualifiés de clients, envoient des requêtes l’autre ou les autres, qualifiés de serveurs, attendent ces")
  4. Détail source à réviser : même protocole pour pouvoir communiquer: HTTP (Hyper Text Transfert Protocol) pour les documents hypertextes (text, images, vidéos, sons); FTP (File Transfert Protocol) pour le transfert des fichiers; SMTP (Simple Mail T (Source: "même protocole pour pouvoir communiquer: HTTP (Hyper Text Transfert Protocol) pour les documents hypertextes (text, images, vidéos, sons); FTP (File Transfert Protocol) pour le transfert des fichiers; SMTP (Simple Mail Transfert Protocol) pour l’envoi des messages électroniques; POP et IMAP pour la réception de messages électroniques. 9 Exemple")
  5. Détail source à réviser : envoyer des messages au serveur qui transmettra au serveur du destinataire final. La réception de courrier : Le destinateur final récupère par POP/IMAP son courrier depuis son serveur qui reçoit les messages du serveur d (Source: "envoyer des messages au serveur qui transmettra au serveur du destinataire final. La réception de courrier : Le destinateur final récupère par POP/IMAP son courrier depuis son serveur qui reçoit les messages du serveur de l'expéditeur Le navigateur (Webmail) peut représenter une alternative au client de messagerie. Dans ce cas, les courriers transitent par")
  6. Détail source à réviser : sur votre disque, une adresse courrier, une page Web publiée par un serveur (serveur de Web). 11 URL Le nom du protocole (HTTP, FTP) Le nom du serveur (adresse IP, ou nom symbolique) Le chemin d’accès à la ressource Le n (Source: "sur votre disque, une adresse courrier, une page Web publiée par un serveur (serveur de Web). 11 URL Le nom du protocole (HTTP, FTP) Le nom du serveur (adresse IP, ou nom symbolique) Le chemin d’accès à la ressource Le nom de la ressource <protocole>://<nomserveur>[:port]/<chemin> 12 Description d'URL Adresse IP : identifiant unique des ordinateurs (ex.")
  7. Détail source à réviser : (ex. FTP/21, SMTP/25, HTTP/80, POP3/110) 13 HTML 14 Le langage HTML HTML : HyperTexte Markup Language Langage de balisage pour structurer des pages web Langage de description ≠ Langage de programmation HTML correspond au (Source: "(ex. FTP/21, SMTP/25, HTTP/80, POP3/110) 13 HTML 14 Le langage HTML HTML : HyperTexte Markup Language Langage de balisage pour structurer des pages web Langage de description ≠ Langage de programmation HTML correspond au code source interprêté dans un navigateur pour afficher une page web. 15 Historique 1991 : HTML 1995 : HTML 2.0 1997 : HTML 3.2")
  8. Détail source à réviser : par paires (ouvrante/fermante) (ex : <p> </p> pour un paragraphe) Le nom de la balise est écrit en minuscule La balise fermante possède un / avant le nom de la balise <balise>contenu</balise> 19 Les balises ponctuelles L (Source: "par paires (ouvrante/fermante) (ex : <p> </p> pour un paragraphe) Le nom de la balise est écrit en minuscule La balise fermante possède un / avant le nom de la balise <balise>contenu</balise> 19 Les balises ponctuelles Les balises peuvent ne pas avoir de contenu (ex: <br/> <br> pour un saut de ligne) En HTML5 le slash de fin n'est pas obligatoire")
  9. Détail source à réviser : généralement des " pour définir la valeur d'un attribut <balise attribut="valeur"> 21 Les commentaires Les commentaires ne sont pas affichés dans le navigateur Ils sont visibles dans le code source Ctrl+U <!-- Ceci est u _(Source: "généralement des " pour définir la valeur d'un attribut <balise attribut="valeur"> 21 Les commentaires Les commentaires ne sont pas affichés dans le navigateur Ils sont visibles dans le code source Ctrl+U <!-- Ceci est un commentaire --> 22 Les entités Les entités permettent d'afficher des caractères spéciaux (accents, signes, etc.) Avec l'unicode, les")_
  10. Détail source à réviser : : acute, grave, circ, uml mais en pratique, on ne les utilise plus. :   € etc. à : à é : é ö : ö î : î Il existe d'autres entités 24 La grammaire HTML On peut définir 5 règles : définir (Source: ": acute, grave, circ, uml mais en pratique, on ne les utilise plus. :   € etc. à : à é : é ö : ö î : î Il existe d'autres entités 24 La grammaire HTML On peut définir 5 règles : définir une balise de zone définir une balise ponctuelle paramétrer une balise à l'aide d'attributs imbriquer des balises ajouter des")
  11. Détail source à réviser : <title>Titre</title> </head> <body> <!-- Commentaire : Hello world ! --> Hello world ! </body> </html> 27 L'entête <!DOCTYPE> HTML 5 HTML 4.01 Strict HTML 4.01 Transitional XHTML 1.0 Strict XHTML 1.0 Transitional <! (Source: "<title>Titre</title> </head> <body> <!-- Commentaire : Hello world ! --> Hello world ! </body> </html> 27 L'entête <!DOCTYPE> HTML 5 HTML 4.01 Strict HTML 4.01 Transitional XHTML 1.0 Strict XHTML 1.0 Transitional <!DOCTYPE html> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <!DOCTYPE html PUBLIC")
  12. Détail source à réviser : 2 autres balises de zone : la zone d'entête (la tête) : <head></head> la zone de contenu (le corps) : <body></body> 29 La balise <head> La balise d'entête contient les informations caractéristiques de la page : encodage (Source: "2 autres balises de zone : la zone d'entête (la tête) : <head></head> la zone de contenu (le corps) : <body></body> 29 La balise <head> La balise d'entête contient les informations caractéristiques de la page : encodage de la page (obligatoire) titre de la page (obligatoire) <meta charset="utf-8"> <title>Titre de la page</title> 30 La balise <head> Elle")
  13. Détail source à réviser : Internet de base"> <meta name="keywords" content="HTML, CSS, JavaScript, PHP, SQL"> <meta name="author" content="Toto"> 31 La balise <body> La balise de contenu contient toutes les informations qui sont affichées par le (Source: "Internet de base"> <meta name="keywords" content="HTML, CSS, JavaScript, PHP, SQL"> <meta name="author" content="Toto"> 31 La balise <body> La balise de contenu contient toutes les informations qui sont affichées par le navigateur : le texte les liens les images etc. 32 Les balises de structure de la page HTML5 introduit des balises")
  14. Détail source à réviser : de la page/section <aside></aside> définit un texte qui se rapporte au sujet de la page/section mais qui ne correspond pas directement au contenu de la page <nav></nav> définit les liens de de navigation 33 Les balises d (Source: "de la page/section <aside></aside> définit un texte qui se rapporte au sujet de la page/section mais qui ne correspond pas directement au contenu de la page <nav></nav> définit les liens de de navigation 33 Les balises de titre <h1>Titre de niveau H1</h1> <h2>Titre de niveau H2</h2> <h3>Titre de niveau H3</h3> <h4>Titre de niveau H4</h4> <h5>Titre de")
  15. Détail source à réviser : pour une note <address></address> pour une adresse <sub></sub> pour des indices <sup></sup> pour des exposants etc. <p>Paragraphe</p> <p> <em>Emphase par défaut en italique</em> <strong>Accentuation par défaut en gras</s (Source: "pour une note <address></address> pour une adresse <sub></sub> pour des indices <sup></sup> pour des exposants etc. <p>Paragraphe</p> <p> <em>Emphase par défaut en italique</em> <strong>Accentuation par défaut en gras</strong> <br>Saut de ligne <hr>ligne horizontale pour séparer du texte </p> 35 Les balises pour les images La balise <img> permet")
  16. Détail source à réviser : width="120"> <img src="inc/img/html.png" alt="logo html"> 36 Les balises pour les figures <figure> <img src="inc/img/html5.png" alt="logo html5"> <figcaption>Titre de l'image</figcaption> </figure> 37 Format des images ( (Source: "width="120"> <img src="inc/img/html.png" alt="logo html"> 36 Les balises pour les figures <figure> <img src="inc/img/html5.png" alt="logo html5"> <figcaption>Titre de l'image</figcaption> </figure> 37 Format des images (JPEG) Joint Photographic Experts Group / JPEG (.jpg, .jpeg) : Format idéal pour les photos et les illustrations compliquées.")
  17. Détail source à réviser : 256 couleurs ou moins. Gère la transparence et les animations. 39 Format des images (PNG) Portable Network Graphics / PNG (.png) : Format libre de droits. Images entrelacées (affichage progressif). Convient pour tout typ (Source: "256 couleurs ou moins. Gère la transparence et les animations. 39 Format des images (PNG) Portable Network Graphics / PNG (.png) : Format libre de droits. Images entrelacées (affichage progressif). Convient pour tout type d’image, la transparence mais pas les animations. Il existe en 8 bits (type GIF, 256 couleurs) et en 24 bits. 40 Format des images")
  18. Détail source à réviser : <svg> 41 Les balises pour les liens Lien hypertexte : Mécanisme qui permet de naviguer d’une pages web à une autre. Permet de ne plus apprendre les adresses des ressources Associé à un texte ou une image sur lesquels on (Source: "<svg> 41 Les balises pour les liens Lien hypertexte : Mécanisme qui permet de naviguer d’une pages web à une autre. Permet de ne plus apprendre les adresses des ressources Associé à un texte ou une image sur lesquels on peut cliquer l'attribut href permet de définir l'URL l'attribut target permet d'ouvrir le lien dans un autre onglet <p> <a")
  19. Détail source à réviser : Les listes ordonnées/non-ordonnées Les listes de définitions <ol><!-- ordererd list --> <li>élément 1</li><!-- list item --> <li>élément 2</li> </ol> <ul><!-- unordererd list --> <li>élément 1</li> <li>élément 2</li> </u (Source: "Les listes ordonnées/non-ordonnées Les listes de définitions <ol><!-- ordererd list --> <li>élément 1</li><!-- list item --> <li>élément 2</li> </ol> <ul><!-- unordererd list --> <li>élément 1</li> <li>élément 2</li> </ul> <dl><!-- definition list --> <dt>terme 1</dt><!-- definition term --> <dd>définition 1</dd><!-- definition description --> <dt>terme")
  20. Détail source à réviser : </li> </ul> 44 Les balises pour les tableaux HTML offre 4 balises pour créer des tableaux <table></table> début et fin de tableau <tr></tr> Ligne du tableau <th></th> Cellule du tableau (entête) <td></td> Cellule du tabl (Source: "</li> </ul> 44 Les balises pour les tableaux HTML offre 4 balises pour créer des tableaux <table></table> début et fin de tableau <tr></tr> Ligne du tableau <th></th> Cellule du tableau (entête) <td></td> Cellule du tableau (contenu) Balises sémantiques <caption></caption> légende du tableau <thead></thead>, <tbody></tbody>, <tfoot></tfoot> structure du")
  21. Détail source à réviser : pour les tableaux Il est possible de fusionner des cellules <td>, <th> Fusionner des colonnes : attribut colspan Fusionner des lignes : attribut rowspan Les valeurs associées aux attributs correspondent au nombre de cell (Source: "pour les tableaux Il est possible de fusionner des cellules <td>, <th> Fusionner des colonnes : attribut colspan Fusionner des lignes : attribut rowspan Les valeurs associées aux attributs correspondent au nombre de cellules à fusionner 47 Exemple d'un tableau avancé <table> <caption>Les chiffres</caption> <tr> <th>A</th><th>B</th><th>C</th><th>D</th> </tr>")
  22. Détail source à réviser : de type inline (pas de retour à la ligne) <div></div> : balise de type block (retour à la ligne) Attributs globaux (toutes les balises) id : identifiant unique dans la page associé à une balise class : classe qui peut-êt (Source: "de type inline (pas de retour à la ligne) <div></div> : balise de type block (retour à la ligne) Attributs globaux (toutes les balises) id : identifiant unique dans la page associé à une balise class : classe qui peut-être associée à plusieurs éléments dans la page title : information affichée au survol de la souris 49 Exemple d'utilisation de balises")
  23. Détail source à réviser : HTML pour le fond, CSS pour la forme 52 Historique 1996 : CSS 1 (base) 1998 : CSS 2 (position, z-index, type de media) 2004-2011 : CSS 2.1 (correction de CSS 2) 2011-2014 : CSS 3 (modules indépendants) 53 La syntaxe /* c (Source: "HTML pour le fond, CSS pour la forme 52 Historique 1996 : CSS 1 (base) 1998 : CSS 2 (position, z-index, type de media) 2004-2011 : CSS 2.1 (correction de CSS 2) 2011-2014 : CSS 3 (modules indépendants) 53 La syntaxe /* commentaire */ selecteur { propriété: valeur; } selecteur1, selecteur2 { propriété1: valeur1; propriété2: valeur2; } 54 Les sélecteurs de")
  24. Détail source à réviser : toutes les balises « nom » avec la classe « class » 55 Comment appliquer du CSS à une page HTML 56 Mise en place du CSS (Méthodes à éviter) Directement dans le HTML balise <style> dans <head> Directement dans les balises (Source: "toutes les balises « nom » avec la classe « class » 55 Comment appliquer du CSS à une page HTML 56 Mise en place du CSS (Méthodes à éviter) Directement dans le HTML balise <style> dans <head> Directement dans les balises attribut style <head> <style>p {color: red;}</style> </head> <body> <p>paragraphe</p> <p style="color: blue;">paragraphe</p> </body>")
  25. Détail source à réviser : <p>paragraphe</p> </body> 58 Exemple <head> <style> /* * { color: red; } / p { background-color: green; } #unique { text-align: center; } .multiple { color: white; } </style> </head> <body> <h1>titre</h1> <p class="mult _(Source: "<p>paragraphe</p> </body> 58 Exemple <head> <style> / * { color: red; } */ p { background-color: green; } #unique { text-align: center; } .multiple { color: white; } </style> </head> <body> <h1>titre</h1> <p class="multiple">paragraphe</p> <p id="unique" class="multiple">paragraphe</p> </body> 59 La couleur Propriétés basiques: color : couleur du")_
  26. Détail source à réviser : : maroon, orange, olive, purple, green, navy, teal Il en existe beaucoup, beaucoup d'autres inspirées du SVG Pas forcément supportées par tous les navigateurs… 61 Les couleurs simples Possibilité de définir des couleurs (Source: ": maroon, orange, olive, purple, green, navy, teal Il en existe beaucoup, beaucoup d'autres inspirées du SVG Pas forcément supportées par tous les navigateurs… 61 Les couleurs simples Possibilité de définir des couleurs en hexadécimal #RVB; #000 : noir : black #f00 : rouge : red #0f0 : vert : lime (pas green) #00f : bleu : blue #fff : blanc : white")
  27. Détail source à réviser : pour chaque couleur : 00-ff 16 millions de couleurs 63 Exemple couleurs <head> <style> .vert-green { color: green; } .vert-lime { color: #0f0; } .vert-clair { color: #aaffaa; } </style> </head> <body> <p class="vert-gree (Source: "pour chaque couleur : 00-ff 16 millions de couleurs 63 Exemple couleurs <head> <style> .vert-green { color: green; } .vert-lime { color: #0f0; } .vert-clair { color: #aaffaa; } </style> </head> <body> <p class="vert-green">vert</p> <p class="vert-lime">vert</p> <p class="vert-clair">vert</p> </body> 64 Les fonctions rgb, hsl Il est possible")
  28. Détail source à réviser : : vert, 240 : bleu), saturation et lightness pourcentage de 0% à 100% Possibilité d'ajouter la transparence avec rgba et hsla, le dernier paramètre alpha est compris entre 0.0 et 1.0 65 Exemple fonctions couleurs <head> (Source: ": vert, 240 : bleu), saturation et lightness pourcentage de 0% à 100% Possibilité d'ajouter la transparence avec rgba et hsla, le dernier paramètre alpha est compris entre 0.0 et 1.0 65 Exemple fonctions couleurs <head> <style> .vert-rgb { color: rgb(0, 255, 0); } .vert-hsl { color: hsl(120, 100%, 50%); } .vert-rgb-clair { color: rgba(0, 255, 0, 0.24); }")
  29. Détail source à réviser : </body> 66 Les propriétés CSS 67 Le fond <head> <style> .background-detail { background-color: lime; background-image: url("inc/img/css3.png"); background-repeat: repeat; /* no-repeat, repeat-x, repeat-y / background-at _(Source: "</body> 66 Les propriétés CSS 67 Le fond <head> <style> .background-detail { background-color: lime; background-image: url("inc/img/css3.png"); background-repeat: repeat; / no-repeat, repeat-x, repeat-y / background-attachment: scroll; / fixed, local / background-position: center center; / left, right / top bottom */ }")_
  30. Détail source à réviser : propriété<br> background</p> </body> 68 L'affichage en boîte https://en.wikipedia.org/wiki/CSS_box_model 69 La propriété margin <head> <style> .margin-detail { margin-top: 6px; /* auto, % / margin-right: 24px; margin-bo _(Source: "propriété<br> background</p> </body> 68 L'affichage en boîte https://en.wikipedia.org/wiki/CSS_box_model 69 La propriété margin <head> <style> .margin-detail { margin-top: 6px; / auto, % / margin-right: 24px; margin-bottom: 42px; margin-left: 84px; } .margin-shorthand { margin: 6px 24px 42px 84px; / 3 valeurs : margin: (top) (right/left) (bottom); / /")_
  31. Détail source à réviser : margin<br> pour tout</p> </body> 70 La propriété padding <head> <style> .padding-detail { padding-top: 6px; /* auto, % / padding-right: 24px; padding-bottom: 42px; padding-left: 84px; } .padding-shorthand { padding: 6px _(Source: "margin<br> pour tout</p> </body> 70 La propriété padding <head> <style> .padding-detail { padding-top: 6px; / auto, % / padding-right: 24px; padding-bottom: 42px; padding-left: 84px; } .padding-shorthand { padding: 6px 24px 42px 84px; / 3 valeurs : padding: (top) (right/left) (bottom); / / 2 valeurs : padding: (top/bottom) (right/left); */")_
  32. Détail source à réviser : La propriété border-style <head> <style> .border-style-detail { border-top-style: solid; border-right-style: dotted; border-bottom-style: double; border-left-style: dashed; } .border-style-shorthand { border-style: solid (Source: "La propriété border-style <head> <style> .border-style-detail { border-top-style: solid; border-right-style: dotted; border-bottom-style: double; border-left-style: dashed; } .border-style-shorthand { border-style: solid dotted double dashed; /* 3, 2 et 1 valeurs cf margin */ } </style> </head> <body> <p class="border-style-detail">les<br> propriétés<br>")
  33. Détail source à réviser : border-bottom-width: 3px; border-left-width: 4px; } .border-width-shorthand { border-style: solid; border-width: 1px 2px 3px 4px; /* 3, 2 et 1 valeurs cf margin / } </style> </head> <body> <p class="border-width-detail" _(Source: "border-bottom-width: 3px; border-left-width: 4px; } .border-width-shorthand { border-style: solid; border-width: 1px 2px 3px 4px; / 3, 2 et 1 valeurs cf margin */ } </style> </head> <body> <p class="border-width-detail">les<br> propriétés<br> border-width<br> en détails</p> <p class="border-width-shorthand">Une<br> seule<br> propriété<br>")_
  34. Détail source à réviser : solid; border-width: 3px; border-color: black red blue green; /* 3, 2 et 1 valeurs cf margin / } </style> </head> <body> <p class="border-color-detail">les<br> propriétés<br> border-color<br> en< détails</p> <p class="b _(Source: "solid; border-width: 3px; border-color: black red blue green; / 3, 2 et 1 valeurs cf margin */ } </style> </head> <body> <p class="border-color-detail">les<br> propriétés<br> border-color<br> en< détails</p> <p class="border-color-shorthand">Une<br> seule<br> propriété<br> border-color</p> </body> 74 La propriété border <head> <style>")_
  35. Détail source à réviser : seule<br> propriété<br> border<br> pour tout</p> </body> 75 Les dimensions en CSS <head> <style> .dimension { width: auto; /* px, % / height: auto; / px, % / min-width: auto; / px, % / max-width: none; / px, % / m _(Source: "seule<br> propriété<br> border<br> pour tout</p> </body> 75 Les dimensions en CSS <head> <style> .dimension { width: auto; / px, % / height: auto; / px, % / min-width: auto; / px, % / max-width: none; / px, % / min-height: auto; / px, % / max-height: none; / px, % / overflow: visible; / hidden, scroll, auto */ } </style> </head> <body> <p")_
  36. Détail source à réviser : etc.) display: inline; Éléments de la page qui ne commence pas sur une nouvelle ligne et qui prend juste la largeur nécessaire (<span>, <a>, <img>, etc.) La dimension d'un élément inline ne peut pas être modifié display: (Source: "etc.) display: inline; Éléments de la page qui ne commence pas sur une nouvelle ligne et qui prend juste la largeur nécessaire (<span>, <a>, <img>, etc.) La dimension d'un élément inline ne peut pas être modifié display: inline-block; élément qui s'affiche comme un élément inline mais sur lequel ont peut modifier les dimensions display: none; masque")
  37. Détail source à réviser : des<br> positions</p> </body> 78 La propriété float <head> <style> .left { float: left; } .right { float: right; /* clear: both; /* left, right / } </style> </head> <body> <p class="left">float left</p> <p class="right" _(Source: "des<br> positions</p> </body> 78 La propriété float <head> <style> .left { float: left; } .right { float: right; / clear: both; /* left, right / } </style> </head> <body> <p class="left">float left</p> <p class="right">float right</p> </body> 79 Les propriétés du texte <head> <style> .text { text-align: center; / left, right, justify */")_
  38. Détail source à réviser : </body> 80 Les propriétés de polices <head> <style> .font-detail { font-style: normal; /* italic, oblique / font-variant: normal; / small-caps / font-weight: normal; / bold, bolder, lighter / font-size: medium; / s (Source: "</body> 80 Les propriétés de polices <head> <style> .font-detail { font-style: normal; /* italic, oblique / font-variant: normal; / small-caps / font-weight: normal; / bold, bolder, lighter / font-size: medium; / small, large, px, % / font-family: "Times New Roman", Georgia, serif; / serif, sans-serif, cursive, fantasy, monospace */ }")
  39. Détail source à réviser : seule<br> propriété<br> font<br> pour tout</p> </body> 81 Les propriétés de tableaux <head> <style> table, td { border: 1px solid black; } .table { border-collapse: separate; /* collapse / border-spacing: 2px; / px / _(Source: "seule<br> propriété<br> font<br> pour tout</p> </body> 81 Les propriétés de tableaux <head> <style> table, td { border: 1px solid black; } .table { border-collapse: separate; / collapse / border-spacing: 2px; / px / / 2 valeurs : horizontal, vertical spacing / / 1 valeur : horizontal/vertical spacing */ } </style> </head> <body>")_
  40. Détail source à réviser : inside; /* outside / list-style-image: url('inc/img/css3.png'); } .list-style-shorthand { list-style: circle inside url('inc/img/css3.png'); } </style> </head> <body> <ul class="list-style-detail"> <li>élément 1</li><li _(Source: "inside; / outside */ list-style-image: url('inc/img/css3.png'); } .list-style-shorthand { list-style: circle inside url('inc/img/css3.png'); } </style> </head> <body> <ul class="list-style-detail"> <li>élément 1</li><li>élément 2</li><li>élément 3</li> </ul> <ul class="list-style-shorthand"> <li>élément 1</li><li>élément 2</li><li>élément")_
  41. Détail source à réviser : : A B div p : toutes les balises <p> qui sont contenues dans une balise <div> La descendance directe : A > B div > p : toutes les balises <p> dont leur parent est une balise <div> Les voisins : A ~ B div ~ p : toutes les (Source: ": A B div p : toutes les balises <p> qui sont contenues dans une balise <div> La descendance directe : A > B div > p : toutes les balises <p> dont leur parent est une balise <div> Les voisins : A ~ B div ~ p : toutes les balises <p> qui suivent une balise <div> Les voisins directs: A + B div + p : toutes les balises <p> qui sont directement après une")
  42. Détail source à réviser : :hover ) 87 Autres sélecteurs pseudo-classe :first-child : premier enfant d'une balise :last-child : dernier enfant d'une balise :nth-child(n) : n-ième enfant d'une balise :nth-child(2) : deuxième enfant d'une balise :nt (Source: ":hover ) 87 Autres sélecteurs pseudo-classe :first-child : premier enfant d'une balise :last-child : dernier enfant d'une balise :nth-child(n) : n-ième enfant d'une balise :nth-child(2) : deuxième enfant d'une balise :nth-child(2n) : enfants pairs d'une balise :nth-child(2n+1) : enfants impairs d'une balise 88 Sélecteur pseudo-éléments ::first-line :")
  43. Détail source à réviser : la propriété content 89 Sélecteur sur attribut [attribut] : toutes les balises ayant cet attribut [attribute=value] : toutes les balises ayant cet attribut dont la valeur est value [attribute*="value"] : toutes les balis (Source: "la propriété content 89 Sélecteur sur attribut [attribut] : toutes les balises ayant cet attribut [attribute=value] : toutes les balises ayant cet attribut dont la valeur est value [attribute*="value"] : toutes les balises ayant cet attribut dont la valeur contient la valeur value [attribute^="value"] : toutes les balises ayant cet attribut dont la valeur")
  44. Détail source à réviser : pour indiquer quelle page va traîter les données attribut method pour dire comment transférer les données (get/post) 91 La balise <input> <form> <label>default: <input name="default" placeholder="placeholder"></label><br (Source: "pour indiquer quelle page va traîter les données attribut method pour dire comment transférer les données (get/post) 91 La balise <input> <form> <label>default: <input name="default" placeholder="placeholder"></label><br> <label>text: <input name="text" type="text" value="value"></label><br> <label>password: <input name="password"")
  45. Détail source à réviser : <input name="checkbox[]" type="checkbox" value="checkbox2"></label><br> <label>radio: <input name="radio" type="radio" value="radio1"></label><br> <label>radio: <input name="radio" type="radio" value="radio2"></label><br (Source: "<input name="checkbox[]" type="checkbox" value="checkbox2"></label><br> <label>radio: <input name="radio" type="radio" value="radio1"></label><br> <label>radio: <input name="radio" type="radio" value="radio2"></label><br> </form> 92 Les attributes de la balise <input> les attributs de base: name permet d'identifier les données value associe")
  46. Détail source à réviser : de la valeur maxlength : longueur max autorisée pour value pattern : permet de définir le format accepté 93 La balise <input> avancé <form> <label for="idpassword">mot de passe: </label><br> <label>password: <input type= (Source: "de la valeur maxlength : longueur max autorisée pour value pattern : permet de définir le format accepté 93 La balise <input> avancé <form> <label for="idpassword">mot de passe: </label><br> <label>password: <input type="password" id="idpassword" name="password" pattern="(?=.\d)(?=.[a-z])(?=.*[A-Z]).{8,}" title="Doit contenir un chiffre, une minuscule,")
  47. Détail source à réviser : <input name="readonly" type="text" value="value" readonly="readonly"></label><br> <label>maxlength: <input name="maxlength" type="text" value="value" maxlength="8"></label><br> <button type="submit">valider</button> </fo (Source: "<input name="readonly" type="text" value="value" readonly="readonly"></label><br> <label>maxlength: <input name="maxlength" type="text" value="value" maxlength="8"></label><br> <button type="submit">valider</button> </form> 94 La balise <input> version html5 color date datetime email number tel url etc. 95 La balise <select></select> <form> <select")
  48. Détail source à réviser : </select> <select name="selectm" multiple="multiple"> <optgroup label="Group 1"> <option value="value1">Valeur 1</option> <option value="value2">Valeur 2</option> </optgroup> <optgroup label="Group 2"> <option value="val (Source: "</select> <select name="selectm" multiple="multiple"> <optgroup label="Group 1"> <option value="value1">Valeur 1</option> <option value="value2">Valeur 2</option> </optgroup> <optgroup label="Group 2"> <option value="value3">Valeur 3</option> <option value="value4">Valeur 4</option> </optgroup> </select> </form> 96 Les balises <textarea></textarea> et")
  49. Détail source à réviser : 1973 : 35 machines connectées sur ARPANET 1975 : TCP + IP + UDP 1984 : TCP/IP au CERN Terminologie dans les années 80 : apparition du mot « Internet » « “Internet”, “l’Internet”, “internet” ou “l’internet” » Amendement p (Source: "1973 : 35 machines connectées sur ARPANET 1975 : TCP + IP + UDP 1984 : TCP/IP au CERN Terminologie dans les années 80 : apparition du mot « Internet » « “Internet”, “l’Internet”, “internet” ou “l’internet” » Amendement pour « l'internet » rejeté le 5 janvier 2016 4 Chronologie 2/2 Historique 1990 : Tim")
  50. Détail source à réviser : 9 Exemple d'application : le mail Le client : le logiciel de messagerie électronique envoie des requêtes et attends les réponses (Source: "9 Exemple d'application : le mail Le client : le logiciel de messagerie électronique envoie des requêtes et attends les réponses")
  51. Détail source à réviser : 10 URL : Universal/Uniform Resource Locator Accéder à une ressource/serveur ⇒ décrire où elle se trouve (Source: "10 URL : Universal/Uniform Resource Locator Accéder à une ressource/serveur ⇒ décrire où elle se trouve")
  52. Détail source à réviser : 2000 : XHTML 2014 : HTML5 16 4 types d'éléments les balises les attributs de balises les commentaires les entités 17 Les balises Une balise : commence par un < possède un nom se termine par un > 18 Les balises de zone Le (Source: "2000 : XHTML 2014 : HTML5 16 4 types d'éléments les balises les attributs de balises les commentaires les entités 17 Les balises Une balise : commence par un < possède un nom se termine par un > 18 Les balises de zone Les balises vont généralement par paires (ouvrante/fermante) (ex : <p> </p> pour un pa")
  53. Détail source à réviser : iaux (accents, signes, etc.) Avec l'unicode, les entités sont surtout utilisés pour <, >, ", ' et & qui pourraient être confondu avec le balisage HTML < < < > > > & & & " " " ' ' ' (Source: "iaux (accents, signes, etc.) Avec l'unicode, les entités sont surtout utilisés pour <, >, ", ' et & qui pourraient être confondu avec le balisage HTML < < < > > > & & & " " " ' ' ' &entite; &#numero; 23 Les entités : accents Pour les accents, il existe différents suffixes : acute, grave, circ, uml mais en prati")
  54. Détail source à réviser : ransitional XHTML 1.0 Strict XHTML 1.0 Transitional <!DOCTYPE html> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN _(Source: "ransitional XHTML 1.0 Strict XHTML 1.0 Transitional <!DOCTYPE html> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dt")_
  55. Détail source à réviser : base"> <meta name="keywords" content="HTML, CSS, JavaScript, PHP, SQL"> <meta name="author" content="Toto"> 31 La balise <body> La balise de contenu contient toutes les informations qui sont affichées par le navigateur : (Source: "base"> <meta name="keywords" content="HTML, CSS, JavaScript, PHP, SQL"> <meta name="author" content="Toto"> 31 La balise <body> La balise de contenu contient toutes les informations qui sont affichées par le navigateur : le texte les liens les images etc. 32 Le")
  56. Détail source à réviser : ne pouvant être affichée ou qui est dicté par certains logiciels d'accessibilité <img src="inc/img/html5.png" alt="logo html5" height="120" width="120"> <img src="inc/img/html.png" alt="logo html"> 36 Les balises pour le (Source: "ne pouvant être affichée ou qui est dicté par certains logiciels d'accessibilité <img src="inc/img/html5.png" alt="logo html5" height="120" width="120"> <img src="inc/img/html.png" alt="logo html"> 36 Les balises pour les figures <figure> <img src="inc/img/html5.png" a")
  57. Détail source à réviser : définir l'URL l'attribut target permet d'ouvrir le lien dans un autre onglet <p> <a href="#html-link" target="_blank">Un élément dans la même page</a><br> <a href="./index.html?print-pdf" target="_blank">Une page du même (Source: "définir l'URL l'attribut target permet d'ouvrir le lien dans un autre onglet <p> <a href="#html-link" target="_blank">Un élément dans la même page</a><br> <a href="./index.html?print-pdf" target="_blank">Une page du même site</a><br> <a href="https://duckduckgo")
  58. Détail source à réviser : li>élément 1</li><!-- list item --> <li>élément 2</li> </ol> <ul><!-- unordererd list --> <li>élément 1</li> <li>élément 2</li> </ul> <dl><!-- definition list --> <dt>terme 1</dt><!-- definition term --> <dd>définition (Source: "li>élément 1</li><!-- list item --> <li>élément 2</li> </ol> <ul><!-- unordererd list --> <li>élément 1</li> <li>élément 2</li> </ul> <dl><!-- definition list --> <dt>terme 1</dt><!-- definition term --> <dd>définition")
  59. Détail source à réviser : 52 Historique 1996 : CSS 1 (base) 1998 : CSS 2 (position, z-index, type de media) 2004-2011 : CSS 2 (Source: "52 Historique 1996 : CSS 1 (base) 1998 : CSS 2 (position, z-index, type de media) 2004-2011 : CSS 2")
  60. Détail source à réviser : 2) 2011-2014 : CSS 3 (modules indépendants) 53 La syntaxe /* commentaire / selecteur { propriété: valeur; } selecteur1, selecteur2 { propriété1: valeur1; propriété2: valeur2; } 54 Les sélecteurs de bases le sélecteur un _(Source: "2) 2011-2014 : CSS 3 (modules indépendants) 53 La syntaxe / commentaire */ selecteur { propriété: valeur; } selecteur1, selecteur2 { propriété1: valeur1; propriété2: valeur2; } 54 Les sélecteurs de bases le sélecteur universel * tous les éléments de la page les balises nom toutes les balises « nom » de la page les identifiants #id l'élément d'identifiant...")_
  61. Détail source à réviser : gn: center; } .multiple { color: white; } </style> </head> <body> <h1>titre</h1> <p class="multiple">paragraphe</p> <p id="unique" class="multiple">paragraphe</p> </body> 59 La couleur Propriétés basiques: color : couleu (Source: "gn: center; } .multiple { color: white; } </style> </head> <body> <h1>titre</h1> <p class="multiple">paragraphe</p> <p id="unique" class="multiple">paragraphe</p> </body> 59 La couleur Propriétés basiques: color : couleur du texte background-color : couleur du")
  62. Détail source à réviser : rt-lime { color: #0f0; } .vert-clair { color: #aaffaa; } </style> </head> <body> <p class="vert-green">vert</p> <p class="vert-lime">vert</p> <p class="vert-clair">vert</p> </body> 64 Les fonctions rgb, hsl Il est possib (Source: "rt-lime { color: #0f0; } .vert-clair { color: #aaffaa; } </style> </head> <body> <p class="vert-green">vert</p> <p class="vert-lime">vert</p> <p class="vert-clair">vert</p> </body> 64 Les fonctions rgb, hsl Il est possible d'éclaircir la couleur grâce à la propr")
  63. Détail source à réviser : ass="background-detail">les<br> propriétés<br> background<br> en<br> détails</p> <p class="background-shorthand">Une<br> seule<br> propriété<br> background</p> </body> 68 L'affichage en boîte https://en.wikipedia.org/wik (Source: "ass="background-detail">les<br> propriétés<br> background<br> en<br> détails</p> <p class="background-shorthand">Une<br> seule<br> propriété<br> background</p> </body> 68 L'affichage en boîte https://en.wikipedia.org/wiki/CSS_box_model 69 La propriété margin <head> <style")
  64. Détail source à réviser : / / 1 valeur : padding: (top/right/bottom/left); / } </style> </head> <body> <p class="padding-detail">les<br> propriétés<br> padding<br> en<br> détails</p> <p class="padding-shorthand">Une<br> seule<br> propriété<br> _(Source: "/ /* 1 valeur : padding: (top/right/bottom/left); */ } </style> </head> <body> <p class="padding-detail">les<br> propriétés<br> padding<br> en<br> détails</p> <p class="padding-shorthand">Une<br> seule<br> propriété<br> padding<br> pour tout</p> </body> 71 La prop")_
  65. Détail source à réviser : th: 1px 2px 3px 4px; /* 3, 2 et 1 valeurs cf margin / } </style> </head> <body> <p class="border-width-detail">les<br> propriétés<br> border-width<br> en détails</p> <p class="border-width-shorthand">Une<br> seule<br> p _(Source: "th: 1px 2px 3px 4px; / 3, 2 et 1 valeurs cf margin */ } </style> </head> <body> <p class="border-width-detail">les<br> propriétés<br> border-width<br> en détails</p> <p class="border-width-shorthand">Une<br> seule<br> propriété<br> border-width</p> </body> 73 La proprié")_
  66. Détail source à réviser : px, % / overflow: visible; / hidden, scroll, auto */ } </style> </head> <body> <p class="dimension">les<br> propriétés<br> des<br> dimensions</p> </body> 76 La propriété display display: block; Éléments de la page qui (Source: "px, % / overflow: visible; / hidden, scroll, auto */ } </style> </head> <body> <p class="dimension">les<br> propriétés<br> des<br> dimensions</p> </body> 76 La propriété display display: block; Éléments de la page qui commence sur une nouvelle ligne et qui pr")
  67. Détail source à réviser : { float: right; /* clear: both; /* left, right / } </style> </head> <body> <p class="left">float left</p> <p class="right">float right</p> </body> 79 Les propriétés du texte <head> <style> .text { text-align: center; / (Source: "{ float: right; /* clear: both; /* left, right / } </style> </head> <body> <p class="left">float left</p> <p class="right">float right</p> </body> 79 Les propriétés du texte <head> <style> .text { text-align: center; / left, right, justify / text-decoration: underline; / o")
  68. Détail source à réviser : { list-style: circle inside url('inc/img/css3.png'); } </style> </head> <body> <ul class="list-style-detail"> <li>élément 1</li><li>élément 2</li><li>élément 3</li> </ul> <ul class="list-style-shorthand"> <li>élément 1</ (Source: "{ list-style: circle inside url('inc/img/css3.png'); } </style> </head> <body> <ul class="list-style-detail"> <li>élément 1</li><li>élément 2</li><li>élément 3</li> </ul> <ul class="list-style-shorthand"> <li>élément 1</li><li>élément 2</li><li>élément 3</li> </ul> </")
  69. Détail source à réviser : udo-classe Spécifiques à la balise <a> :link : liens pas encore visités :visited : liens visités Pas spécifique :hover : la souris survole l'élément (après :link et :visited) :active : la souris agit sur l'élément (Source: "udo-classe Spécifiques à la balise <a> :link : liens pas encore visités :visited : liens visités Pas spécifique :hover : la souris survole l'élément (après :link et :visited) :active : la souris agit sur l'élément")
  70. Détail source à réviser : value] : toutes les balises ayant cet attribut dont la valeur est value [attribute*="value"] : toutes les balises ayant cet attribut dont la valeur contient la valeur value [attribute^="value"] : toutes les balises ayant (Source: "value] : toutes les balises ayant cet attribut dont la valeur est value [attribute*="value"] : toutes les balises ayant cet attribut dont la valeur contient la valeur value [attribute^="value"] : toutes les balises ayant cet attribut dont la valeur commence par la valeur value [attribute$="value"] : toutes les balises ayant cet attribut dont la")
  71. Détail source à réviser : ttern : permet de définir le format accepté 93 La balise <input> avancé <form> <label for="idpassword">mot de passe: </label><br> <label>password: <input type="password" id="idpassword" name="password" pattern="(?=.\d)( _(Source: "ttern : permet de définir le format accepté 93 La balise <input> avancé <form> <label for="idpassword">mot de passe: </label><br> <label>password: <input type="password" id="idpassword" name="password" pattern="(?=.\d)(?=.[a-z])(?=.[A-Z]).{8,}" title="Doit co")_
  72. Détail source à réviser : "readonly"></label><br> <label>maxlength: <input name="maxlength" type="text" value="value" maxlength="8"></label><br> <button type="submit">valider</button> </form> 94 La balise <input> version html5 color date datetime (Source: ""readonly"></label><br> <label>maxlength: <input name="maxlength" type="text" value="value" maxlength="8"></label><br> <button type="submit">valider</button> </form> 94 La balise <input> version html5 color date datetime email number tel url etc. 95 La balise <se")
  73. Détail source à réviser : mot « Internet » « “Internet”, “l’Internet”, “internet” ou “l’internet” » Amendement pour « l'internet » rejeté le 5 janvier 2016 4 Chronologie 2/2 Historique 1990 : Tim Berners Lee du CERN propose l'idée du World Wide W (Source: "mot « Internet » « “Internet”, “l’Internet”, “internet” ou “l’internet” » Amendement pour « l'internet » rejeté le 5 janvier 2016 4 Chronologie 2/2 Historique 1990 : Tim Berners Lee du CERN propose l'idée du World Wide Web 1993 : Premier navigateur Mosaic 1994 : C")
  74. Détail source à réviser : arget permet d'ouvrir le lien dans un autre onglet <p> <a href="#html-link" target="_blank">Un élément dans la même page</a><br> <a href="./index.html?print-pdf" target="_blank">Une page du même site</a><br> <a href="htt (Source: "arget permet d'ouvrir le lien dans un autre onglet <p> <a href="#html-link" target="_blank">Un élément dans la même page</a><br> <a href="./index.html?print-pdf" target="_blank">Une page du même site</a><br> <a href="https://duckduckgo.com" target="_blank">Une page d'un autre site</a><br> </p> 42")
  75. Détail source à réviser : link" target="_blank">Un élément dans la même page</a><br> <a href="./index.html?print-pdf" target="_blank">Une page du même site</a><br> <a href="https://duckduckgo.com" target="_blank">Une page d'un autre site</a><br> _(Source: "link" target="blank">Un élément dans la même page</a><br> <a href="./index.html?print-pdf" target="_blank">Une page du même site</a><br> <a href="https://duckduckgo.com" target="_blank">Une page d'un autre site</a><br> </p> 42 Les balises pour les listes Les")
  76. Détail source à réviser : lank">Un élément dans la même page</a><br> <a href="./index.html?print-pdf" target="_blank">Une page du même site</a><br> <a href="https://duckduckgo.com" target="_blank">Une page d'un autre site</a><br> </p> 42 Les bali (Source: "lank">Un élément dans la même page</a><br> <a href="./index.html?print-pdf" target="_blank">Une page du même site</a><br> <a href="https://duckduckgo.com" target="_blank">Une page d'un autre site</a><br> </p> 42 Les balises pour les listes Les listes ordonnées/non-ordonnées Les listes de dé")
  77. Détail source à réviser : l?print-pdf" target="_blank">Une page du même site</a><br> <a href="https://duckduckgo.com" target="_blank">Une page d'un autre site</a><br> </p> 42 Les balises pour les listes Les listes ordonnées/non-ordonnées Les list _(Source: "l?print-pdf" target="blank">Une page du même site</a><br> <a href="https://duckduckgo.com" target="_blank">Une page d'un autre site</a><br> </p> 42 Les balises pour les listes Les listes ordonnées/non-ordonnées Les listes de définitions <ol><!-- ordererd list")
  78. Détail source à réviser : 2011-2014 : CSS 3 (modules indépendants) 53 La syntaxe /* commentaire / selecteur { propriété: valeur; } selecteur1, selecteur2 { propriété1: valeur1; propriété2: valeur2; } 54 Les sélecteurs de bases le sélecteur unive _(Source: "2011-2014 : CSS 3 (modules indépendants) 53 La syntaxe / commentaire */ selecteur { propriété: valeur; } selecteur1, selecteur2 { propriété1: valeur1; propriété2: valeur2; } 54 Les sélecteurs de bases le sélecteur universel * tous les éléments de la page les balises nom toutes les balises « nom » de la page")_
  79. Détail source à réviser : TCP + IP + UDP 1984 : TCP/IP au CERN Terminologie dans les années 80 : apparition du mot « Internet » « “Internet”, “l’Internet”, “internet” ou “l’internet” » Amendement pour « l'internet » rejeté le 5 janvier 2016 4 Chr (Source: "TCP + IP + UDP 1984 : TCP/IP au CERN Terminologie dans les années 80 : apparition du mot « Internet » « “Internet”, “l’Internet”, “internet” ou “l’internet” » Amendement pour « l'internet » rejeté le 5 janvier 2016 4 Chronologie 2/2 Historique 1990 : Tim Berner")
  80. Détail source à réviser : DP 1984 : TCP/IP au CERN Terminologie dans les années 80 : apparition du mot « Internet » « “Internet”, “l’Internet”, “internet” ou “l’internet” » Amendement pour « l'internet » rejeté le 5 janvier 2016 4 Chronologie 2/2 (Source: "DP 1984 : TCP/IP au CERN Terminologie dans les années 80 : apparition du mot « Internet » « “Internet”, “l’Internet”, “internet” ou “l’internet” » Amendement pour « l'internet » rejeté le 5 janvier 2016 4 Chronologie 2/2 Historique 1990 : Tim Berners Lee du CERN")
  81. Détail source à réviser : les années 80 : apparition du mot « Internet » « “Internet”, “l’Internet”, “internet” ou “l’internet” » Amendement pour « l'internet » rejeté le 5 janvier 2016 4 Chronologie 2/2 Historique 1990 : Tim Berners Lee du CERN (Source: "les années 80 : apparition du mot « Internet » « “Internet”, “l’Internet”, “internet” ou “l’internet” » Amendement pour « l'internet » rejeté le 5 janvier 2016 4 Chronologie 2/2 Historique 1990 : Tim Berners Lee du CERN propose l'idée du World Wide Web 1993 : P")
  82. Détail source à réviser : 1993 : Premier navigateur Mosaic 1994 : Création de Yahoo (Source: "1993 : Premier navigateur Mosaic 1994 : Création de Yahoo")
  83. Détail source à réviser : 15 Historique 1991 : HTML 1995 : HTML 2 (Source: "15 Historique 1991 : HTML 1995 : HTML 2")
  84. Détail source à réviser : 4. Les formulaires 2 Internet Historique Concepts de base 3 Chronologie 1/2 Historique 1969 : Le réseau ARPANET initial constituée de 4 ordinateurs (UCLA, Stanford Research Institute, Santa Barbara, Salt Lake City ) est (Source: "4. Les formulaires 2 Internet Historique Concepts de base 3 Chronologie 1/2 Historique 1969 : Le réseau ARPANET initial constituée de 4 ordinateurs (UCLA, Stanford Research Institute, Santa Barbara, Salt Lake City ) est fonctionnel")
  85. Détail source à réviser : 2 Historique 1969 : Le réseau ARPANET initial constituée de 4 ordinateurs (UCLA, Stanford Research Institute, Santa Barbara, Salt Lake City ) est fonctionnel (Source: "2 Historique 1969 : Le réseau ARPANET initial constituée de 4 ordinateurs (UCLA, Stanford Research Institute, Santa Barbara, Salt Lake City ) est fonctionnel")
  86. Détail source à réviser : cé <form> <label for="idpassword">mot de passe: </label><br> <label>password: <input type="password" id="idpassword" name="password" pattern="(?=.\d)(?=.[a-z])(?=.[A-Z]).{8,}" title="Doit contenir un chiffre, une minu _(Source: "cé <form> <label for="idpassword">mot de passe: </label><br> <label>password: <input type="password" id="idpassword" name="password" pattern="(?=.\d)(?=.[a-z])(?=.[A-Z]).{8,}" title="Doit contenir un chiffre, une minuscule, une majuscule et au moins 8 carac")_
  87. Détail source à réviser : el for="idpassword">mot de passe: </label><br> <label>password: <input type="password" id="idpassword" name="password" pattern="(?=.\d)(?=.[a-z])(?=.*[A-Z]).{8,}" title="Doit contenir un chiffre, une minuscule, une maj (Source: "el for="idpassword">mot de passe: </label><br> <label>password: <input type="password" id="idpassword" name="password" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="Doit contenir un chiffre, une minuscule, une majuscule et au moins 8 caractères"></label><")
  88. Détail source à réviser : ">mot de passe: </label><br> <label>password: <input type="password" id="idpassword" name="password" pattern="(?=.\d)(?=.[a-z])(?=.*[A-Z]).{8,}" title="Doit contenir un chiffre, une minuscule, une majuscule et au moins (Source: "">mot de passe: </label><br> <label>password: <input type="password" id="idpassword" name="password" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="Doit contenir un chiffre, une minuscule, une majuscule et au moins 8 caractères"></label><br> <label>text:")
  89. Détail source à réviser : abel><br> <label>password: <input type="password" id="idpassword" name="password" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="Doit contenir un chiffre, une minuscule, une majuscule et au moins 8 caractères"></la (Source: "abel><br> <label>password: <input type="password" id="idpassword" name="password" pattern="(?=.*\d)(?=.*[a-z])(?=.*[A-Z]).{8,}" title="Doit contenir un chiffre, une minuscule, une majuscule et au moins 8 caractères"></label><br> <label>text: <input name="text" type="text" value="value"")
  90. Détail source à réviser : word" id="idpassword" name="password" pattern="(?=.\d)(?=.[a-z])(?=.[A-Z]).{8,}" title="Doit contenir un chiffre, une minuscule, une majuscule et au moins 8 caractères"></label><br> <label>text: <input name="text" typ _(Source: "word" id="idpassword" name="password" pattern="(?=.\d)(?=.[a-z])(?=.[A-Z]).{8,}" title="Doit contenir un chiffre, une minuscule, une majuscule et au moins 8 caractères"></label><br> <label>text: <input name="text" type="text" value="value" required="required"></label><br> <label>disabled: <input name="disabled" type="text" val")_
  91. Détail source à réviser : IP au CERN Terminologie dans les années 80 : apparition du mot « Internet » « “Internet”, “l’Internet”, “internet” ou “l’internet” » Amendement pour « l'internet » rejeté le 5 janvier 2016 4 Chronologie 2/2 Historique 19 (Source: "IP au CERN Terminologie dans les années 80 : apparition du mot « Internet » « “Internet”, “l’Internet”, “internet” ou “l’internet” » Amendement pour « l'internet » rejeté le 5 janvier 2016 4 Chronologie 2/2 Historique 1990 : Tim Berners Lee du CERN propose l'idé")
  92. Détail source à réviser : minologie dans les années 80 : apparition du mot « Internet » « “Internet”, “l’Internet”, “internet” ou “l’internet” » Amendement pour « l'internet » rejeté le 5 janvier 2016 4 Chronologie 2/2 Historique 1990 : Tim Berne (Source: "minologie dans les années 80 : apparition du mot « Internet » « “Internet”, “l’Internet”, “internet” ou “l’internet” » Amendement pour « l'internet » rejeté le 5 janvier 2016 4 Chronologie 2/2 Historique 1990 : Tim Berners Lee du CERN propose l'idée du World W")
  93. Détail source à réviser : 1994 : Tim Berners Lee fonde le World Wide Web Consortium (W3C) 5 Concepts de base Réseaux Architecture client/serveur URL 6 Le réseau Protocoles TCP/IP : couche réseau-hôte : carte réseau (Ethernet/Wifi) + Drivers couch (Source: "1994 : Tim Berners Lee fonde le World Wide Web Consortium (W3C) 5 Concepts de base Réseaux Architecture client/serveur URL 6 Le réseau Protocoles TCP/IP : couche réseau-hôte : carte réseau (Ethernet/Wifi) + Drivers couche internet : gestion du routage, e")
  94. Détail source à réviser : XHTML 1.0 Transitional <!DOCTYPE html> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml _(Source: "XHTML 1.0 Transitional <!DOCTYPE html> <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 28 La balise <html> Une page HTML co")_
  95. Détail source à réviser : -//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 28 La balise <html> Une page H (Source: "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 28 La balise <html> Une page HTML commence toujours par une balise <html> Une page HTML finit toujou")
  96. Détail source à réviser : .org/TR/html4/strict.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 28 La balise <html> Une page HTML commence toujours par une balise <htm (Source: ".org/TR/html4/strict.dtd"> <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> 28 La balise <html> Une page HTML commence toujours par une balise <html> Une page HTML finit toujours par une balise </html> Entre ces deux balises, il y a t")

📅 Repères chronologiques

DateÉvénement
1969Constitution du réseau ARPANET initial avec 4 ordinateurs
197335 machines connectées sur ARPANET
1990Proposition de l'idée du World Wide Web par Tim Berners Lee

📊 Tableaux de Synthèse

ÉlémentDescriptionAnnéeAuteur
ARPANETRéseau initial constitué en 1969, avec 4 ordinateurs, évoluant à 35 en 19731969, 1973N/A
World Wide WebProposition par Tim Berners Lee en 1990, création du W3C en 19941990, 1994Tim Berners Lee
HTMLLangage de balisage pour structurer les pages web, versions majeures depuis 19911991, 1995, 1997, 1999, 2000, 2014N/A
CSSNormes successives : CSS1 (1996), CSS2 (1998), CSS2.1 (2004-2011), CSS3 (2011-2014)1996, 1998, 2004-2011, 2011-2014N/A

⚠️ Pièges & Confusions Fréquentes

  1. Confondre la couche réseau-hôte avec la couche internet ; la première concerne la carte réseau et ses pilotes, la seconde le routage via ICMP.
  2. Oublier que HTML est un langage de balisage sans logique de programmation.
  3. Confusion entre les différentes versions d'HTML : HTML 2.0, HTML 3.2, HTML 4.01, XHTML et HTML5.
  4. Mal interpréter l'attribut Target dans HTML : il indique où ouvrir le document lié (nouvel onglet ou même).
  5. Négliger l'importance des attributs globaux comme class et title pour la structuration et l'interactivité.
  6. Confondre les formats de couleurs CSS : hexadécimal, rgb(), hsl(), rgba(), hsla() et leur gestion de la transparence.
  7. Oublier que le W3C a été fondé en 1994 pour standardiser le Web après la proposition de Berners Lee en 1990.

✅ Checklist Examen

  • Connaître l’origine du réseau ARPANET et ses évolutions jusqu’en 1973.
  • Identifier la date de proposition du World Wide Web par Tim Berners Lee.
  • Savoir que le W3C a été créé en 1994 pour standardiser les technologies du Web.
  • Maîtriser les principales versions d’HTML et leur année de sortie.
  • Connaître la structure fondamentale d’une page HTML : <html>, <head>, <body>.
  • Savoir que HTML5 a introduit des balises sémantiques et de nouvelles fonctionnalités en 2014.
  • Comprendre le rôle des attributs globaux comme class et title en HTML.
  • Connaître les différentes méthodes d’application du CSS : interne (<style>), externe (fichier .css), inline.
  • Savoir utiliser les sélecteurs CSS de base : universel (*), balise, #id, .class.
  • Maîtriser la syntaxe CSS : propriété: valeur; et l’utilisation des commentaires /* ... */.
  • Connaître les formats de couleurs CSS : hexadécimal (#fff), rgb(), hsl(), rgba(), hsla().
  • Comprendre le rôle des ports réseau dans la communication entre services (ex : port 21 pour FTP).
  • Savoir que le DNS traduit les noms de domaine en adresses IP.
  • Identifier un formulaire HTML avec <form>, ses attributs action et method, ainsi que les éléments <input> et leurs attributs (name, value, disabled).
  • Reconnaître une balise <meta> dans <head> pour définir le charset ou d’autres métadonnées.
  • Savoir que le protocole TCP/IP inclut la couche transport avec TCP/UDP et la couche internet avec IP.
  • Maîtriser la différence entre XHTML et HTML selon leur déclaration doctype.

Teste seu conhecimento

Teste seu conhecimento sobre Introduction aux fondamentaux du Web com 11 perguntas de múltipla escolha com correções detalhadas.

1. En quelle année Tim Berners Lee a-t-il proposé l'idée du World Wide Web ?

2. Comment la couche réseau-hôte intervient-elle dans la communication réseau d'un ordinateur ?

Faça o quiz →

Revisar com flashcards

Memorize os conceitos chave de Introduction aux fondamentaux du Web com 24 flashcards interativos.

Internet — origine ?

Réseau ARPANET de 1969, 4 ordinateurs.

W3C — fondation ?

Créé en 1994 par Tim Berners Lee.

HTML — version 1991 ?

HTML 1.0, version initiale.

Veja os flashcards →

Similar courses

Introduction à l'Intelligence Artificielle Symbolique

Intelligence Artificielle

Introduction aux documents et sécurité en construction

Bases de données

Introduction à l'Informatique et IA

Introduction aux marchés publics et réglementations du bâtiment

Bases de données

Gestion des imprimantes Windows et PDF

Introduction aux bases de données relationnelles

Bases de données

Crie suas próprias fichas de revisão

Importe seu curso e a IA gera fichas, quizzes e flashcards em 30 segundos.

Gerador de fichas