DOSSIER D'ACTIVITES SUR LE HTML N 12 Appliquer des feuilles de style aux formulaires

Save this PDF as:
 WORD  PNG  TXT  JPG

Dimension: px
Commencer à balayer dès la page:

Download "DOSSIER D'ACTIVITES SUR LE HTML N 12 Appliquer des feuilles de style aux formulaires"

Transcription

1 DOSSIER D'ACTIVITES SUR LE HTML N 12 Appliquer des feuilles de style aux formulaires Objectifs : Apprendre à l apprenant à se créer un espace de travail sous Linux Apprendre à l apprenant à ouvrir un éditeur de code HTML Apprendre à l apprenant à insérer les balises de définition de toute page Web Apprendre à l apprenant à insérer des feuilles de style à l'aide d'un fichier externe Apprendre à l'apprenant à utiliser les différentes feuilles de style liées aux zones de saisie d'un formulaire Apprendre à l'apprenant à gérer les classes de feuilles de style Apprendre à l apprenant à visualiser les pages Web créées Apprendre à l apprenant à visualiser les modifications effectuées sur le fichier HTML

2 La procédure de création d'un nouveau dossier sous Linux 1. Se placer dans le «dossier personnel». 2. Cliquer droit n'importe où dans la fenêtre du «dossier personnel». Un menu contextuel apparaît. 3. Choisir la commande «Créer un nouveau dossier». Une fenêtre de dialogue du navigateur Konqueror apparaît. Elle permet la saisie du nom du nouveau dossier. 4. Saisir le nom du nouveau dossier (nom, prenom, nom du futur site Web) et le valider à l'aide du bouton «OK». La procédure d'ouverture d'un logiciel «éditeur de textes» 1. Choisir le Menu K ou Red Hat. 2. Choisir le menu des «Editeurs de textes». 3. Cliquer, par exemple, sur Kate, sur Kwrite ou sur Kedit (Editeur de textes) pour lancer l'éditeur de votre choix. Les balises de définition de toute page Web <!DOCTYPE HTML PUBLIC «-//W3C//DTD HTML 4.01 Transitional//EN» «http://www.w3.org/tr/html4/transitional.dtd»> <html> <head> </head> <body> </body> </html>

3 La procédure d'enregistrement d'un fichier HTML L'objectif de l'enregistrement d'un fichier HTML est de le sauvegarder dans le répertoire dédié au site web en construction. 1. Trouver la fonction «Enregistrer sous» de l'éditeur de codes HTML utilisé. 2. Se placer dans le dossier précédemment créé. 3. Saisir dans la zone de saisie réservée à cet effet, le nom (formulaire) et l'extension du fichier (html) : formulaire.html. 4. Enregistrer le fichier en cliquant sur le bouton «Enregistrer» ou «OK», selon l'éditeur de codes HTML. La procédure de visualisation d'une page Web dans un navigateur L'objectif est de donner au navigateur l'adresse exacte de la page Web à afficher. Ouvrir un navigateur (Mozilla, Konqueror, etc), depuis la barre des tâches ou le menu K, puis Internet. Sous Mozilla : 1. Cliquer sur la commande «Fichier > Ouvrir un fichier» ou «Ctrl + O». 2. Dans la fenêtre de dialogue qui apparaît, rechercher le fichier précédemment enregistré à l'adresse suivante : «file:///root/site_votreprenom/formulaire.html». 3. Sélectionner le fichier «formulaire.html», puis valider. Celui-ci s'affiche alors dans le navigateur. Sous Konqueror : 1. Cliquer sur le menu «Document > Ouvrir une URL». 2. Dans la fenêtre de dialogue qui apparaît, rechercher le fichier précédemment enregistré à l'adresse suivante : «file:/root/site_votreprenom/formulaire.html». 3. Sélectionner le fichier «formulaire.html», puis valider. Celui-ci s'affiche alors dans le navigateur.

4 La procédure de visualisation des modifications effectuées sur un fichier HTML 1. Effectuer les modifications sur le fichier HTML. 2. Enregistrer de nouveau le fichier HTML. 3. Si la fenêtre du navigateur est toujours ouverte, cliquer sur le bouton «Actualiser» : pour Mozilla pour Konqueror tous deux présents dans la barre des boutons standards. Sinon, reprendre la procédure de visualisation d'un fichier HTML dans un navigateur. Une feuille de style dans un fichier externe Le code de la page «formulaire.html» est le suivant : <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/tr/html4/transitional.dtd"> <html> <head> <title>un formulaire HTML</title> <link rel="stylesheet" type="text/css" href="styles_formulaire.css" /> </head> <body> <h1>formulaire d inscription</h1> <form method="post" action="formulaire.php"> Saisir votre nom : <input type="text" name="nom_internaute" size="15" maxlenght="30" value="votre nom" />

5 Saisir votre prénom : <input type="text" name="prenom_internaute" size="15" maxlenght="30" value="votre prénom" /> Saisir votre adresse <input type="text" name=" _internaute" size="40" maxlenght="80" value="votre adresse " /> Saisir un identifiant : <input type="text" name="id_internaute" size="15" maxlenght="30" value="" /> Saisir un mot de passe : <input type="password" name="password_internaute" size="15" maxlenght="30" value="password" /> Saisir votre adresse postale complète : <textarea name="adresse_internaute" rows="6" cols="40" wrap="physical">votre adresse</textarea> Choisir votre boisson : <select name="boisson" size="2"> <option selected value="café">café</option> <option value="thé">thé</option> <option value="jus d orange">jus d orange</option> <option value="eau">eau</option> <option value="eau gazeuse">eau gazeuse</option> <option value="rien">rien</option> </select>

6 <input type="submit" value="valider l inscription" /> <input type="reset" value="annuler l inscription" /> </form> </body> </html> Le lien entre la page «formulaire.html» et le fichier «styles_formulaire.css» est défini par la balise <link /> (lien en anglais). Cette balise accepte les attributs suivants : - rel détermine la relation comme «relation à la page suivante». Ici, la page suivante est un fichier qui contient les feuilles de style. - type définit le type MIME de la relation. - href établit le lien avec le fichier externe «styles_formulaire.css». Les feuilles de style appliquées aux formulaires L'utilisation des feuilles de style appliquées aux formulaires permet de pallier l'aspect austère, voire triste de ces derniers. Les feuilles de style permettent de mettre en forme l'aspect des formulaires et les éléments des formulaires. Les mises en forme s'appliquent aux balises <form>...</form>, <input />, <select>...</select>, <textarea>...</textarea>, avec ou sans classe. Le code du fichier «styles_formulaire.css» appliqué à la balise <form>...</form> est le suivant : form { background-image: url(fond.gif); padding: 20px; }

7 La syntaxe des feuilles de style est la suivante : propriété: valeur; - background-image définit l'image de fond du formulaire. La valeur possible présente la mention «url()». Est ensuite spécifié entre les parenthèses, l'adresse de l'image de fond. - padding définit la largeur de l'espace à l'intérieur du formulaire, c'est-à-dire l'espace compris entre les éléments du formulaire et le bord de celui-ci. Les valeurs applicables sont des chiffres exprimés en pixels (px), en centimètres (cm), en millimètres (mm), en point (pt), en pourcentage (%). Le code du fichier «styles_formulaire.css» appliqué à les différentes balises <input /> est le suivant : input.text { font-family: Verdana; font-size: 13px; font-weight: bold; color: #c5161d; background-color: #ffde59; } input.pwd { font-family: Arial; font-size: 8px; font-weight: bold; color: #000000; background-color: #ffde59; border-color: #c5161d; }

8 input.bouton { font-family: Arial; font-size: 14px; font-weight: bold; color: #000000; background-color: #ffde59; border-color: red; border-width: 5px; cursor: n-resize; } La syntaxe des feuilles de style est la suivante : propriété: valeur; - font-family définit la famille de la police. Les valeurs possibles sont soit liées à une police spécifique comme «Arial», «Helvetica», «Times Roman», soit liées à une famille générique comme «sans-serif» (famille de police avec empattement), «serif» (famille sans empattement), «monospace» (famille proche des signes courrier), «cursive» (famille pour une écriture manuscrite), «fantasy» (famille pour une écriture originale), etc. Remarque : l'application d'une police ou d'une famille de police est dépendante de la présence de ce type de police dans l'ordinateur qui interprète la page Web. La valeur possible présente la mention «url()». Est ensuite spécifié entre les parenthèses, l'adresse de l'image de fond. - font-size définit la taille de la police. Les valeurs applicables sont des chiffres exprimés en pixels (px), en centimètres (cm), en millimètres (mm), en points (pt), en poucentage (%) ou des expressions du type : «xx-small», «xsmall», «small», «medium», «large», «x-large», «xx-large», «larger», «smaller».

9 - font-weight spécifie la graisse de la police, c'est-à-dire l'état visuel plus ou moins gras de la police. Les valeurs possibles sont «bold» (gras), «bolder» (très gras), «lighter» (plus fin), «normal» (valeur par défaut), ou les chiffres suivants : 100 (très fin), 200, 300, 400, 500, 600, 700, 800, 900 (très gras). - color définit la couleur de la police. Les valeurs sont le code hexadécimal de la couleur (#00FF00) ou le nom de la couleur en anglais (green). - background-color définit la couleur de fond. Les valeurs sont le code hexadécimal de la couleur (#00FF00) ou le nom de la couleur en anglais (green). - border-color définit la couleur de la bordure de la zone de saisie. Les valeurs sont le code hexadécimal de la couleur (#00FF00) ou le nom de la couleur en anglais (green). - border-width définit la largeur de la bordure de l'élément. Les valeurs applicables sont des chiffres exprimés en pixels (px), en centimètres (cm), en millimètres (mm), en points (pt), en poucentage (%). - cursor définit la forme du pointeur lors du survol. Les valeurs possibles sont «default» (valeur par défaut, soit la flèche), «pointer» (main), «eresize» (double-flèche horizontale), «n-resize» (double-flèche verticale), «crosshair» (croix), «text» (curseur de texte vertical), «help» (point d'interrogation).

10 Le code du fichier «styles_formulaire.css» appliqué à les différentes balises <select>...</select> est le suivant : select { font-family: Courrier; font-size: 11px; font-weight: lighter; color: #c5161f; background-color: #d2d3d5; width: 300px; } La syntaxe des feuilles de style est la suivante : propriété: valeur; - font-family définit la famille de la police. Les valeurs possibles sont soit liées à une police spécifique comme «Arial», «Helvetica», «Times Roman», soit liées à une famille générique comme «sans-serif» (famille de police avec empattement), «serif» (famille sans empattement), «monospace» (famille proche des signes courrier), «cursive» (famille pour une écriture manuscrite), «fantasy» (famille pour une écriture originale), etc. Remarque : l'application d'une police ou d'une famille de police est dépendante de la présence de ce type de police dans l'ordinateur qui interprète la page Web. La valeur possible présente la mention «url()». Est ensuite spécifié entre les parenthèses, l'adresse de l'image de fond.

11 - font-size définit la taille de la police. Les valeurs applicables sont des chiffres exprimés en pixels (px), en centimètres (cm), en millimètres (mm), en points (pt), en poucentage (%) ou des expressions du type : «xx-small», «xsmall», «small», «medium», «large», «x-large», «xx-large», «larger», «smaller». - font-weight spécifie la graisse de la police, c'est-à-dire l'état visuel plus ou moins gras de la police. Les valeurs possibles sont «bold» (gras), «bolder» (très gras), «lighter» (plus fin), «normal» (valeur par défaut), ou les chiffres suivants : 100 (très fin), 200, 300, 400, 500, 600, 700, 800, 900 (très gras). - color définit la couleur de la police. Les valeurs sont le code hexadécimal de la couleur (#00FF00) ou le nom de la couleur en anglais (green). - background-color définit la couleur de fond. Les valeurs sont le code hexadécimal de la couleur (#00FF00) ou le nom de la couleur en anglais (green). - width définit la largeur de l'élément. Les valeurs applicables sont des chiffres exprimés en pixels (px), en centimètres (cm), en millimètres (mm), en points (pt), en poucentage (%).

12 Le code du fichier «styles_formulaire.css» appliqué à les différentes balises <textarea>...</textarea> est le suivant : textarea { font-family: Helvetica; font-size: 11px; font-weight: lighter; color: #c5161f; background-color: #d2d3d5; } La syntaxe des feuilles de style est la suivante : propriété: valeur; - font-family définit la famille de la police. Les valeurs possibles sont soit liées à une police spécifique comme «Arial», «Helvetica», «Times Roman», soit liées à une famille générique comme «sans-serif» (famille de police avec empattement), «serif» (famille sans empattement), «monospace» (famille proche des signes courrier), «cursive» (famille pour une écriture manuscrite), «fantasy» (famille pour une écriture originale), etc. Remarque : l'application d'une police ou d'une famille de police est dépendante de la présence de ce type de police dans l'ordinateur qui interprète la page Web. La valeur possible présente la mention «url()». Est ensuite spécifié entre les parenthèses, l'adresse de l'image de fond. - font-size définit la taille de la police. Les valeurs applicables sont des chiffres exprimés en pixels (px), en centimètres (cm), en millimètres (mm), en points (pt), en poucentage (%).

13 - font-weight spécifie la graisse de la police, c'est-à-dire l'état visuel plus ou moins gras de la police. Les valeurs possibles sont «bold» (gras), «bolder» (très gras), «lighter» (plus fin), «normal» (valeur par défaut), ou les chiffres suivants : 100 (très fin), 200, 300, 400, 500, 600, 700, 800, 900 (très gras). - color définit la couleur de la police. Les valeurs sont le code hexadécimal de la couleur (#00FF00) ou le nom de la couleur en anglais (green). - background-color définit la couleur de fond. Les valeurs sont le code hexadécimal de la couleur (#00FF00) ou le nom de la couleur en anglais (green). Le fichier «formulaire.html», avec l'insertion des classes Le code de la page «formulaire.html» devient alors le suivant. Les éléments liés aux classes sont spécifiés en gras : <!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/tr/html4/transitional.dtd"> <html> <head> <title>un formulaire HTML</title> <link rel="stylesheet" type="text/css" href="styles_formulaire.css" /> </head>

14 <body> <h1>formulaire d inscription</h1> <form method="post" action="formulaire.php"> Saisir votre nom : <input type="text" name="nom_internaute" size="15" maxlenght="30" value="votre nom" class="text" /> Saisir votre prénom : <input type="text" name="prenom_internaute" size="15" maxlenght="30" value="votre prénom" class="text" /> Saisir votre adresse <input type="text" name=" _internaute" size="40" maxlenght="80" value="votre adresse " class="text" /> Saisir un identifiant : <input type="text" name="id_internaute" size="15" maxlenght="30" value="" class="text" /> Saisir un mot de passe : <input type="password" name="password_internaute" size="15" maxlenght="30" value="password" class="pwd" /> Saisir votre adresse postale complète : <textarea name="adresse_internaute" rows="6" cols="40" wrap="physical">votre adresse</textarea>

15 Choisir votre boisson : <select name="boisson" size="2" > <option selected value="café">café</option> <option value="thé">thé</option> <option value="jus d orange">jus d orange</option> <option value="eau">eau</option> <option value="eau gazeuse">eau gazeuse</option> <option value="rien">rien</option> </select> <input type="submit" value="valider l inscription" class="bouton" /> <input type="reset" value="annuler l inscription" class="bouton" /> </form> </body> </html>

16

DOSSIER D'ACTIVITES SUR LE HTML N 9 Appliquer des feuilles de style à du texte

DOSSIER D'ACTIVITES SUR LE HTML N 9 Appliquer des feuilles de style à du texte DOSSIER D'ACTIVITES SUR LE HTML N 9 Appliquer des feuilles de style à du texte Objectifs : Apprendre à l apprenant à se créer un espace de travail sous Linux Apprendre à l apprenant à ouvrir un éditeur

Plus en détail

DOSSIER D'ACTIVITES SUR LE PHP N 05 Insérer des données dans une base de données

DOSSIER D'ACTIVITES SUR LE PHP N 05 Insérer des données dans une base de données DOSSIER D'ACTIVITES SUR LE PHP N 05 Insérer des données dans une base de données Objectifs : Apprendre à l apprenant à lancer un serveur local «Apache» Apprendre à l'apprenant à lancer un serveur MySQL

Plus en détail

3/ ATELIER WEB LANGAGE CSS

3/ ATELIER WEB LANGAGE CSS 3/ ATELIER WEB LANGAGE CSS *Cascading Style Sheets : feuilles de style en cascade. Les feuilles de style servent, comme leur nom l'indique, à contenir les styles que vont prendre les différents éléments

Plus en détail

Les CSS et la gestion des différentes polices La police, la taille du texte, gras ou pas, tous ces paramètres sont réglables en CSS.

Les CSS et la gestion des différentes polices La police, la taille du texte, gras ou pas, tous ces paramètres sont réglables en CSS. La police, la taille du texte, gras ou pas, tous ces paramètres sont réglables en CSS. font-family: Famille de police font-size: Taille de votre police de caratère font-style: Le style de police. Gras,

Plus en détail

Dossier ISN : Tracés de fonctions mathématiques :

Dossier ISN : Tracés de fonctions mathématiques : Dossier ISN : Tracés de fonctions mathématiques : Par Crosetti Pauline et Depoers Quentin. Lycée Colbert Tourcoing. Année scolaire 2012/2013. Sommaire : - Recherches et étude du projet - Html - Css - Javascript

Plus en détail

ISN S9: Les pages web

ISN S9: Les pages web Objectif : Mettre en forme une page HTML Lors de l'écriture de pages web, nous savons qu'il faut prendre l'habitude de toujours séparer : Le fond (le contenu) : c'est le rôle du fichier HTML. La décoration

Plus en détail

DOSSIER D'ACTIVITES SUR LE PUBLIPOSTAGE Réaliser un publipostage avec OpenOffice

DOSSIER D'ACTIVITES SUR LE PUBLIPOSTAGE Réaliser un publipostage avec OpenOffice DOSSIER D'ACTIVITES SUR LE PUBLIPOSTAGE Réaliser un publipostage avec OpenOffice Objectifs : Apprendre à l apprenant à se créer un espace de travail sous Linux Apprendre à l'apprenant à ouvrir un tableur

Plus en détail

introduction principes syntaxe CSS : introduction Université Lille 1 Technologies du Web CSS : introduction 1

introduction principes syntaxe CSS : introduction Université Lille 1 Technologies du Web CSS : introduction 1 CSS : introduction Université Lille 1 Technologies du Web CSS : introduction 1 au programme... 1 introduction 2 principes 3 syntaxe Université Lille 1 Technologies du Web CSS : introduction 2 au programme...

Plus en détail

Création d'un site Web avec KompoZer

Création d'un site Web avec KompoZer Création d'un site Web avec KompoZer Table des matières 1Rudiments sur le langage HTML.1 1.1Structure d'une page web :.1 1.2Le langage des pages Web.2 2Préparation du site web..2 3Utilisation d'une feuille

Plus en détail

INTRODUCTION AU LANGAGE HTML ET CSS

INTRODUCTION AU LANGAGE HTML ET CSS INTRODUCTION AU LANGAGE HTML ET CSS Sur le Web il est d usage de séparer structure et contenu d une page (html) de son style (css) Quelques liens : http://validator.w3.org/:pour vérifier que le est conforme

Plus en détail

Chapitre 3 : Le langage HTML

Chapitre 3 : Le langage HTML Chapitre 3 : Le langage HTML 4 ème SI (TIC) I. Introduction : Le langage HTML (HyperText Markup Language) n'est pas un langage de programmation proprement dit. Il permet tout simplement de spécifier la

Plus en détail

Couleurs, polices et autres attributs. Les feuilles de styles CSS. Les feuilles de style CSS. Page HTML avec fichier CSS

Couleurs, polices et autres attributs. Les feuilles de styles CSS. Les feuilles de style CSS. Page HTML avec fichier CSS Couleurs, polices et autres attributs Les feuilles de styles CSS Jusqu à HTML 3.2 : on utilise les attributs des balises. Exemples : ... ...

Plus en détail

Votre mission : mettre en page un CV

Votre mission : mettre en page un CV Votre mission : mettre en page un CV ISSION : BUTS DE LA M penoffice Writer - Créer un fichier O CV - Y saisir le texte du CV nsemble du texte du - Mettre en forme l e CV - Mettre en page le Dossier Activités

Plus en détail

Objectif : séparer le contenu de la présentation. Tout ce qui sera de la présentation sera géré par du CSS. Code dédié dans le de la page :

Objectif : séparer le contenu de la présentation. Tout ce qui sera de la présentation sera géré par du CSS. Code dédié dans le <head> de la page : CSS La présentation Objectif : séparer le contenu de la présentation. Tout ce qui sera de la présentation sera géré par du CSS. Code dédié dans le de la page : body { background: orange;

Plus en détail

Introduction aux technologies WEB. Pr. Hajar IGUER

Introduction aux technologies WEB. Pr. Hajar IGUER Introduction aux technologies WEB Pr. Hajar IGUER hajar.iguer@uic.ac.ma CSS : CASCADING STYLE SHEET I 2 Historique CSS a été introduit avec HTML 4, afin de fournir une meilleure façon de mettre en forme

Plus en détail

L1 - Informatique et internet

L1 - Informatique et internet L1 - Informatique et internet Hervé Le Crosnier laboratoire GREYC - Université de Caen! herve.lecrosnier@unicaen.fr http://ensweb.users.info.unicaen.fr HTML + CSS Listes, images et liens Page HTML

Plus en détail

TP 3 : Formulaires. M1106 Initiation au développement Web. Exercice 1 : Mon premier formulaire HTML5

TP 3 : Formulaires. M1106 Initiation au développement Web. Exercice 1 : Mon premier formulaire HTML5 IUT de Villetaneuse, Université Paris 13, Sorbonne Paris Cité DUT R&T 1 re année M1106 Initiation au développement Web 20162017 TP 3 : Formulaires Étienne André Version du sujet : 7 octobre 2016 Ce TP

Plus en détail

HTML & CSS. d e s i g n w e b. [ présentation ]

HTML & CSS. d e s i g n w e b. [ présentation ] d e s i g n w e b [ présentation ] Généralités Les feuilles de styles (CSS) existent depuis 1996. Elles ne sont vraiment correctement supportées par les navigateurs que depuis 2000-2001. C'est donc depuis

Plus en détail

TD n 3 - Notion de langage CSS. Table des matières

TD n 3 - Notion de langage CSS. Table des matières TD n 3 - Notion de langage CSS Table des matières 1-Mettre en forme un page en utilisant la balise ...2 2-Mettre en forme un page en utilisant une feuille de style externe...4 3-Conseils pratiques

Plus en détail

DAW Développement Applications Web. Ouadfel Salima Site du cours:

DAW Développement Applications Web. Ouadfel Salima Site du cours: DAW Développement Applications Web Ouadfel Salima Site du cours: http://salimaouadfel.e-monsite.com/ Conception de page web statique 2. CSS3 Validation CSS W3C Validator at http://jigsaw.w3.org/css-validator/

Plus en détail

Responsable : F. CHAKER-KHARRAT Niveau : 3 ème ESSAI Notes du cours :

Responsable : F. CHAKER-KHARRAT Niveau : 3 ème ESSAI Notes du cours : COURS PROGRAMMATION WEB ASCADING STYLE SHEETS CSS CASCADING Responsable : F. CHAKER-KHARRAT Niveau : 3 ème ESSAI Notes du cours : http://essai.rnu.tn/enseignants/fatmachaker2.htm Année Universitaire :

Plus en détail

STUDIO - TI6 TABLE DES MATIÈRES. NOUVELLE MATIÈRE (suite) 9. Intégration du logo. Sujet. HTML - CSS révisions - suite.

STUDIO - TI6 TABLE DES MATIÈRES. NOUVELLE MATIÈRE (suite) 9. Intégration du logo. Sujet. HTML - CSS révisions - suite. STUDIO - TI6 PASCAL PLACEMAN Sujet HTML - CSS révisions - suite TABLE DES MATIÈRES Nouvelle matière: 9. Intégration du logo 10. Un titre devant la vidéo 11. Utiliser des polices typographiques grâce à

Plus en détail

Les formulaires types

Les formulaires types Les formulaires types Les formulaires types Formulaires interactifs Permettant de saisir des informations en remplissant des champs ou en cliquant sur des boutons Les formulaires De quoi avez vous besoin

Plus en détail

TD n 5 : Feuilles de styles

TD n 5 : Feuilles de styles TD n 5 : Feuilles de styles 1. Préparation du site a. Récupérez le site avec liens internes et tableaux du TD4 et assurez vous qu il soit dans un dossier aide-memoire sous D:\et-l2. 2. Joindre une feuille

Plus en détail

Feuilles de style en cascade. Utilisation des CSS. Yan Bodain

Feuilles de style en cascade. Utilisation des CSS. Yan Bodain Feuilles de style en cascade Utilisation des CSS Cascading Style Sheets Yan Bodain (Yan.Bodain@polymtl.ca) Chercheur-développeur Maison des technologies de l'information et des communications pour la formation

Plus en détail

Les feuilles de style

Les feuilles de style 1 Les feuilles de style 1. introduction... 1 2. déclaration de style dans le document... 1 3. définitions de style dans les fichiers externes... 5 4. Les attributs de définitions de style... 6 1. introduction

Plus en détail

Cours de I21 SOMMAIRE

Cours de I21 SOMMAIRE Cours de I21 Voir le chap 2 : cours de Javascript SOMMAIRE I. Introduction sur le langage HTML II. Balises primaires a. mise en forme b. hyperliens c. insérer une image III. Création de listes IV. Création

Plus en détail

Introduction. Principe général : distinction entre le contenu et la forme Rappel de quelques avantages découlant de cette distinction :

Introduction. Principe général : distinction entre le contenu et la forme Rappel de quelques avantages découlant de cette distinction : Introduction Principe général : distinction entre le contenu et la forme Rappel de quelques avantages découlant de cette distinction : Alléger les pages Web (une définition pouvant s'appliquer à plusieurs

Plus en détail

1 - travail en pleine page du navigateur

1 - travail en pleine page du navigateur Utilisation du bandeau Fckeditor «TEXTE ENRICHI» dans les pages du site internet Version 1 du 7 avril 2009 Bandeau de l éditeur Fckeditor 1 - travail en pleine page du navigateur Pour faciliter le travail

Plus en détail

CSS 3. Julien David. A101 - Julien David (A / 27

CSS 3. Julien David. A101 - Julien David (A / 27 CSS 3 Julien David A101 - david@lipn.univ-paris13.fr 2016 Julien David (A101 - david@lipn.univ-paris13.fr) 2016 1 / 27 Feuilles de styles Cascading Style Sheets CSS est un langage de feuilles de styles.

Plus en détail

Création de sites Web ~ Module 1 Introduction HTML - CSS

Création de sites Web ~ Module 1 Introduction HTML - CSS Création de sites Web ~ Module 1 Introduction HTML - CSS 1 Introduction : HTML, pour HyperText Markup Language, est le langage conçu pour représenter les pages Internet. C est un langage de balises permettant

Plus en détail

Guide d'utilisation. OpenOffice Writer

Guide d'utilisation. OpenOffice Writer Guide d'utilisation OpenOffice Writer CRÉER UN NOUVEAU DOCUMENT Fiche Guide N 1 cliquer sur l outil sur la flèche de l'outil Nouveau OUVRIR UN DOCUMENT EXISTANT Fiche Guide N 2 Cliquer sur l'outil Ouvrir

Plus en détail

Création de sites Web ~ Module 1 Introduction HTML - CSS

Création de sites Web ~ Module 1 Introduction HTML - CSS Création de sites Web ~ Module 1 Introduction HTML - CSS 1 Introduction : HTML, pour HyperText Markup Language, est le langage conçu pour représenter les pages Internet. C est un langage de balises permettant

Plus en détail

DAW Développement Applications Web. Ouadfel Salima Site du cours:

DAW Développement Applications Web. Ouadfel Salima Site du cours: DAW Développement Applications Web Ouadfel Salima Site du cours: http://salimaouadfel.e-monsite.com/ Les formulaires Permettent aux auteurs de pages Web de doter leur page web d'éléments interactifs permettant

Plus en détail

Introduction aux feuilles de style CSS

Introduction aux feuilles de style CSS Introduction aux feuilles de style CSS Jean-Philippe PERNIN Université Stendhal Département Informatique Pédagogique Bureau I 113 Mél. : Jean-Philippe.Pernin@u-grenoble3.fr Jean-Philippe Pernin - DIP -

Plus en détail

LANGAGE HTML : FEUILLES DE STYLE ET LANGAGE CSS

LANGAGE HTML : FEUILLES DE STYLE ET LANGAGE CSS ISN ISN Informatique et Sciences du Numérique LANGAGE HTML : FEUILLES DE STYLE ET LANGAGE CSS 1 INTRODUCTION AUX FEUILLES DE STYLE Le langage HTML est à la fois un langage permettant de décrire la structure

Plus en détail

Langages de l Internet

Langages de l Internet Langages de l Internet http://sebastien.mavromatis.free.fr/ Les feuilles de style CSS : Cascading Style Sheet Recommandation du W3C CSS1 (1996), CSS2 (1998), CSS2.1 (2005), CSS3 Support par les navigateurs

Plus en détail

H T M L. Hyper Text Markup Language II Structure (ou squelette) d un fichier HTML

H T M L. Hyper Text Markup Language II Structure (ou squelette) d un fichier HTML Page Web statique «Le langage HTML» Activité 1 : 1. Créer un répertoire sous le nom TPHTML dans le dossier 4TIC HTML de la racine D:\. 2. Dans le dossier HTML créer un nouveau fichier Document texte. a.

Plus en détail

CSS CSS : Cascading Style Sheets (feuilles de styles en cascade ) Cas générale : La structure du code : Nom_balise { Propriété : valeur ;

CSS CSS : Cascading Style Sheets (feuilles de styles en cascade ) Cas générale : La structure du code : Nom_balise { Propriété : valeur ; CSS CSS : Cascading Style Sheets (feuilles de styles en cascade ) Cas générale : La structure du code : Nom_balise Pour les commentaires : /* un commentaire */ Classe : La construction d une classe :.ma_classe

Plus en détail

SPÉCIFICITÉS TECHNIQUES ING

SPÉCIFICITÉS TECHNIQUES  ING Nos Recommandations Informations obligatoires Les informations obligatoires Sender Objet Adresses de BAT XXX via L argus Champs de personnification Eviter les caractères accentués dans l objet du message

Plus en détail

DOSSIER D'ACTIVITES SUR LE PHP N 04 Afficher des données issues d'une base de données avec PHP et MySQL

DOSSIER D'ACTIVITES SUR LE PHP N 04 Afficher des données issues d'une base de données avec PHP et MySQL DOSSIER D'ACTIVITES SUR LE PHP N 04 Afficher des données issues d'une base de données avec PHP et MySQL Objectifs : Apprendre à l apprenant à lancer un serveur local «Apache» Apprendre à l'apprenant à

Plus en détail

Université de Nice-Sophia Antipolis Jeudi 15 mars Création et Manipulation de documents

Université de Nice-Sophia Antipolis Jeudi 15 mars Création et Manipulation de documents Université de Nice-Sophia Antipolis Jeudi 15 mars 2007 Polytech CiP1 Durée: 1h30 Création et Manipulation de documents (Hélène Renard / Sylvain Schmitz) Travaux Dirigés Séance n o 6 1 Objectifs du TD Utiliser

Plus en détail

- WEB / HTML - Annexe 1 : Définition des balises HTML

- WEB / HTML - Annexe 1 : Définition des balises HTML Balises d encadrement - WEB / HTML - Annexe 1 : Définition des balises HTML Encadre le code source. Encadre la zone d entête de la page Web dans laquelle

Plus en détail

PAGE 1. L écran du logiciel NVU. Barre de menu: Les commandes du logiciel

PAGE 1. L écran du logiciel NVU. Barre de menu: Les commandes du logiciel PAGE L écran du logiciel NVU Nom du document : Nom d enregistrement Barre de mise forme: Texte, couleurs, fond,... Barre de menu: Les commandes du logiciel Barre d outils: Les boutons de commande Gestionnaire

Plus en détail

UTILISER MCK3. - Utilisez les boutons à gauche pour ajouter des objets sur la page. (Voir Chap. III)

UTILISER MCK3. - Utilisez les boutons à gauche pour ajouter des objets sur la page. (Voir Chap. III) UTILISER MCK3 1.C Pour bien commencer Après avoir installé et démarré MCK, vous pouvez créer un nouveau projet. 1 Cliquez sur " Créer un nouveau projet ". 2 Après avoir donné un nom à votre projet, vous

Plus en détail

Guide Utilisation HTML et Microsoft FrontPage

Guide Utilisation HTML et Microsoft FrontPage Guide Utilisation HTML et Microsoft FrontPage 4 4me Année Sciences Informatique Année scolaire : 2016-2017 I. Introduction au langage HTML HTML est un langage de description. Il permet d'enrichir un texte

Plus en détail

texte affiché

<div id=nom_id class=ma_classe>texte affiché</div> Rappel - Les sélecteurs de base La syntaxe de CSS est simple, elle est composée de 3 éléments: un sélecteur des propriétés des valeurs sélecteur { Il existe 3 sélecteurs de base: le sélecteur de balise

Plus en détail

Langage HTML (suite).

Langage HTML (suite). Langage HTML (suite). Walid Belkhir Université de Provence belkhir@cmi.univ-mrs.fr http://www.lif.univ-mrs.fr/ belkhir/ 1 / 36 Plan de la partie 1 (2 séances) Internet et le Web (cours 1) Un outil pour

Plus en détail

INF2005 Programmation web CSS. Jacques Berger

INF2005 Programmation web CSS. Jacques Berger INF2005 Programmation web CSS Jacques Berger Objectifs L'utilité de CSS La syntaxe de CSS L'intégration à HTML Prérequis HTML CSS Cascading Style Sheets Version courante : CSS 3 Le problème initial Pollution

Plus en détail

PROPRIETES DES STYLES

PROPRIETES DES STYLES PROPRIETES DES STYLES POLICES DE CARACTERES font-family Polices de caractères. On peut mettre une liste de police dans l ordre de préférence. Les noms des polices doivent dans ce cas être séparées par

Plus en détail

TP4 Feuille de style Class, ID, Pseudo-element &pseudo-class

TP4 Feuille de style Class, ID, Pseudo-element &pseudo-class TP4 Feuille de style Class, ID, Pseudo-element &pseudo-class Création et mise en forme d'une page Web avec une feuille de style Ouvrez la page index.htm qui envoyer par email. Insérez une feuille de style

Plus en détail

Chapitre 1 : Prise en main d Excel

Chapitre 1 : Prise en main d Excel Chapitre 1 : Prise en main d Excel I. Qu'est-ce qu'un tableur? Un tableur permet de saisir des données, de faire des traitements sur ces données et de les afficher. Les originalités du tableur sont l'organisation

Plus en détail

MISE EN FORME CSS D'UN FORMULAIRE

MISE EN FORME CSS D'UN FORMULAIRE Par défaut, les formulaires ne sont pas folichons. Pourtant, quel site n'a pas son formulaire? (euh... mammouthland?!!) Dès lors, la tentation est grande de mettre les champs dans des tableaux pour les

Plus en détail

Afficher le menu contextuel

Afficher le menu contextuel Afficher le menu contextuel Utilisez le comportement Afficher le menu contextuel pour créer ou modifier un menu contextuel Dreamweaver ou pour ouvrir et modifier un menu contextuel Fireworks inséré dans

Plus en détail

Plan Généralités Syntaxe CSS Appliquer un style Ressources CSS : Définir les couleurs Texte Arrière plan Exercices

Plan Généralités Syntaxe CSS Appliquer un style Ressources CSS : Définir les couleurs Texte Arrière plan Exercices Dreamweaver CSS Plan Généralités Syntaxe CSS Appliquer un style Ressources CSS : Définir les couleurs Texte Arrière plan Exercices CSS CSS - Cascading Style Sheets Servent à mettre en forme les éléments

Plus en détail

Université d Angers

Université d Angers pascal.nicolas@univ-angers.fr 1 préambule cette présentation, basée sur la norme HTML3.2, n a pas vocation à être exhaustive la notation X Y signifie que l on peut mettre l élément X ou l élément Y dans

Plus en détail

> RETOUR A LA LIGNE. Pour forcer un retour à la ligne, insérez la balise
. [BR comme BReak (rupture) en anglais]

> RETOUR A LA LIGNE. Pour forcer un retour à la ligne, insérez la balise <BR>. [BR comme BReak (rupture) en anglais] GUIDE HTML ADMINIS TRATIO N DE VO TRE SITE Ce document présente les principales balises HTML pour vous permettre d enrichir la présentation des textes gérés par formulaire d administration. > L usage de

Plus en détail

Aide à la mise en forme de documents courts sous Open Office Writer

Aide à la mise en forme de documents courts sous Open Office Writer Aide à la mise en forme de documents courts sous Open Office Writer Sélectionner du texte...2 Sélectionner une zone de texte à l'aide de la souris...2 Sélectionner une zone de texte à l'aide du clavier...2

Plus en détail

Traitement des Formulaires

Traitement des Formulaires Traitement des Formulaires 1 Requetês et réponses Exemple de requête: demande d une page GET / HTTP/1.1 Host: exemple.org Exemple de réponse HTTP/1.1 200 OK Content Type: text/html Content Length: 419

Plus en détail

CSS. Alexandre Benoit TS10. D après openclassrooms

CSS. Alexandre Benoit TS10. D après openclassrooms CSS D après openclassrooms Alexandre Benoit TS10 I Les bases du CSS 2 / 31 Introduction Où écrit t on le CSS? : 3 / 31 Introduction Où écrit t on le CSS? : Dans un nouveau fichier par exemple, nous l écrirons

Plus en détail

Cours réalisé par : Ilahi Néjib TP TIC (HTML) Matière : Technologie de l information et de la communication Classe : 4 SI Enseignant : Ilahi Néjib

Cours réalisé par : Ilahi Néjib TP TIC (HTML) Matière : Technologie de l information et de la communication Classe : 4 SI Enseignant : Ilahi Néjib TP TIC (HTML) Matière : Technologie de l information et de la communication Classe : 4 SI Enseignant : Ilahi Néjib Durée : 2 heures Date : Octobre 07 A.S :2007/2008 TP N 1 : Objectifs : Savoir écrire le

Plus en détail

GL/ITEC 2915F Automne 2011 L utilisation de l ordinateur et des logiciels d applications I DEVOIR # 2 A soumettre le 12 décembre 2011 avant minuit

GL/ITEC 2915F Automne 2011 L utilisation de l ordinateur et des logiciels d applications I DEVOIR # 2 A soumettre le 12 décembre 2011 avant minuit Glendon Campus Information Technology (ITEC) Objectifs GL/ITEC 2915F Automne 2011 L utilisation de l ordinateur et des logiciels d applications I DEVOIR # 2 A soumettre le 12 décembre 2011 avant minuit

Plus en détail

TECHNOLOGIE DE L INFORMATION

TECHNOLOGIE DE L INFORMATION Les FICHES-GUIDE du tableur-grapheur OpenOffice pour WINDOWS TECHNOLOGIE DE L INFORMATION PRÉSENTATION de L ÉCRAN du TABLEUR de OpenOffice pour WINDOWS Barre de titre Zone de référence de cellule (colonne

Plus en détail

Guide d utilisation. de la plateforme Web 4

Guide d utilisation. de la plateforme Web 4 Guide d utilisation de la plateforme Web 4 Table des matières Interactivité dans ce document... 03 1. Connexion... 04 2.1 Connexion à la console d administration... 04 2. Tableau de bord... 05 2.1 Vue

Plus en détail

Editeur HTML. Mozilla

Editeur HTML. Mozilla Editeur HTML Mozilla Présentation Mozilla est un navigateur Web, il permet également de gérer la messagerie (Email) et d'éditer des pages au format HTML (Hyper Text Markup Language). Mozilla est basé à

Plus en détail

Programmation Web TD8- CSS

Programmation Web TD8- CSS ²Université de la Manouba Ecole Supérieure d'economie Numérique Programmation Web TD8- CSS Objectifs - Développer des pages Web HTML5 validées - Mettre en place des fichiers CSS pour une meilleure présentation

Plus en détail

Écriture de pages Web

Écriture de pages Web Écriture de pages Web Le langage CSS Laurent Tichit Janvier 2011 Copyright 2005-2009 Laurent Tichit 1 Les feuilles de styles CSS Elles permettent de changer la mise en forme d'une page HTML ou XHTML sans

Plus en détail

Formulaire HTML 1. Introduction. 2. Définition de formulaire. ligne de texte 4. Mot de passe 5. Bouton radio 6. Cases à Cocher»

Formulaire HTML 1. Introduction. 2. Définition de formulaire. ligne de texte 4. Mot de passe 5. Bouton radio 6. Cases à Cocher» Formulaire HTML 1. Introduction. 2. Définition de formulaire. 3. Entrée e d une d ligne de texte 4. Mot de passe 5. Bouton radio 6. Cases à Cocher 7. Bouton «Envoyer» 8. Bouton «Reset» 9. Bouton «Général»

Plus en détail

PHP et formulaires TP N 5. Découvrir les formulaires HTML pour saisir des valeurs dans les scripts PHP (HTML). Utiliser des boucles et des conditions.

PHP et formulaires TP N 5. Découvrir les formulaires HTML pour saisir des valeurs dans les scripts PHP (HTML). Utiliser des boucles et des conditions. 1 OBJECTIF Découvrir les formulaires HTML pour saisir des valeurs dans les scripts PHP (HTML). Utiliser des boucles et des conditions. 1.1 CRÉATION D UN FORMULAIRE Afin de pouvoir interagir avec PHP, il

Plus en détail

Principe. 501_bouton.html. Classe.btn classe secondaire.btn-default : Un bouton peut servir à : Valider un formulaire

Principe. 501_bouton.html. Classe.btn classe secondaire.btn-default : Un bouton peut servir à : Valider un formulaire Les boutons Principe Classe.btn classe secondaire.btn-default : Un bouton peut servir à : Valider un formulaire Lancer un script tajax Pointer vers un lien hypertexte Exemples :

Plus en détail

K2EDITEUR. Edition des éléments Agence Digitale tous droits de reproduction interdits sans autorisation

K2EDITEUR. Edition des éléments Agence Digitale tous droits de reproduction interdits sans autorisation K2EDITEUR Edition des éléments 2014 Agence Digitale tous droits de reproduction interdits sans autorisation Page n 1/24 Page n 1/8 AVANT-PROPOS UNE DOUBLE OBLIGATION : FAVORISER LA LISIBILITE ET LA COMPREHENSION

Plus en détail

CSS. Alexandre Benoit TS 2016/2017. D après openclassrooms

CSS. Alexandre Benoit TS 2016/2017. D après openclassrooms CSS D après openclassrooms Alexandre Benoit TS 2016/2017 I Les bases du CSS 2 / 29 Introduction Où écrit t on le CSS? : Dans un nouveau fichier par exemple, nous l écrirons dans le fichier style.css Dans

Plus en détail

Attribut : style. Attribut style Balise toutes

Attribut : style. Attribut style Balise toutes CSS 2.1 Attribut : style Attribut style Balise toutes !

Plus en détail

Développement. Web. Gaël Mahé. UFR math-info. automne 2005

Développement. Web. Gaël Mahé. UFR math-info. automne 2005 Développement Client Web Gaël Mahé UFR math-info automne 2005 Introduction 2 langages s'intégrant dans HTML, interprétés par le navigateur : CSS = langage de style JavaScript = langage de programmation

Plus en détail

TE C H N O L O G I E DE L IN F O R M A T I O N

TE C H N O L O G I E DE L IN F O R M A T I O N TE C H N O L O G I E DE L IN F O R M A T I O N Le tableur-grapheur Activité 2 ACTIVITÉ 2 Oo_act2.odt Page 1 Objectifs : Entrer des données et des formules simples dans une cellule. Modifier la présentation

Plus en détail

TECHNOLOGIE DE L INFORMATION

TECHNOLOGIE DE L INFORMATION Les FICHES-GUIDE du tableur-grapheur LibreOffice pour WINDOWS re TECHNOLOGIE DE L INFORMATION PRÉSENTATION de L ÉCRAN du TABLEUR de LibreOffice pour WINDOWS Barre de titre Barre de menus Zone de référence

Plus en détail

On le retrouve dans plusieurs modules tels que le courrier, le forum, l agenda, les tâches, les communiqués et plus particulièrement dans Édu-Notes.

On le retrouve dans plusieurs modules tels que le courrier, le forum, l agenda, les tâches, les communiqués et plus particulièrement dans Édu-Notes. 154 L éditeur de texte L ÉDITEUR DE TEXTE L éditeur de texte du portail est une application destinée à créer et modifier des textes pour créer des documents HTML. L éditeur de texte possède certaines fonctions

Plus en détail

HTML. Informatique de l Internet: le langage HTML HTML. Navigateur. Structure (1) Balises (1)

HTML. Informatique de l Internet: le langage HTML HTML. Navigateur. Structure (1) Balises (1) HTML Informatique de l Internet: le langage HTML Joël Quinqueton Dépt MIAp, UFR IV UPV Université Montpellier III Balises et structure des documents HTML Formulaires Cadres Feuilles de style HTML Hyper

Plus en détail

Initiation à OpenOffice Texte

Initiation à OpenOffice Texte Initiation à OpenOffice Texte Saisir du texte : La première étape pour réaliser une lettre ou un document est d en taper le texte au clavier. Le texte tapé apparaît dans le document à l endroit du curseur

Plus en détail

HTML5 et CSS3. Table des matières : CE qu'est l'html5 Déclaration De Page page 3 Ossature D'une Page Les Balises. Les Nouvelles Balises CSS3

HTML5 et CSS3. Table des matières : CE qu'est l'html5 Déclaration De Page page 3 Ossature D'une Page Les Balises. Les Nouvelles Balises CSS3 HTML5 et CSS3. Table des matières : CE qu'est l'html5 page 2 Déclaration De Page page 3 Ossature D'une Page page 3 Les Balises...page 4-6 Les Nouvelles Balises...page 4-6 CSS3 page 7-9 Page 1/9 HTML5 Le

Plus en détail

OFADIS Organisme de formation Siège Sociale : 49 grande rue Arpajon R.C.S d Evry Tel : Fax :

OFADIS Organisme de formation Siège Sociale : 49 grande rue Arpajon R.C.S d Evry Tel : Fax : MANUEL UTILISATEUR EXCEL 2003 Travailler et calculer sur plusieurs feuilles OFADIS Organisme de formation Siège Sociale : 49 grande rue 91290 Arpajon R.C.S d Evry 529 924 417 Tel : 01 83 64 25 11 Fax :

Plus en détail

Utilisation du Web. Sommaire. Notions de base 1

Utilisation du Web. Sommaire. Notions de base 1 Utilisation du Web Sommaire Notions de base 1 Navigation Saisie d une URL (adresse http) dans la barre d adresse 2 Cliquer sur un lien hypertexte (ou hyperlien) 2 Définition 2 Utilisation 2 Utilisation

Plus en détail

Fiche technique. OpenOffice.org «WRITER»

Fiche technique. OpenOffice.org «WRITER» Fiche technique OpenOffice.org «WRITER» 1 SOMMAIRE I / Utiliser les fonctions de base du traitement de texte...3 1.1. Démarrer l'application «Writer»...3 1.2. Ouvrir et enregistrer des documents...3 1.2.1

Plus en détail

Exemple pour un formulaire classique sans l'aide de script CGI :

Exemple pour un formulaire classique sans l'aide de script CGI : <form method=post enctype=text/plain> Formulaires 1. Introduction La création des formulaires se réalise grâce à plusieurs champs, dans lesquels le visiteur entre une information ou opte pour un choix. L'information est ensuite envoyée, à

Plus en détail

Les CSS un menu vertical Nous allons créer un dossier menu_vertical. Comprenant les sous dossiers style, images, multi_niveaux, un niveau et _notes

Les CSS un menu vertical Nous allons créer un dossier menu_vertical. Comprenant les sous dossiers style, images, multi_niveaux, un niveau et _notes Les CSS un menu vertical Nous allons créer un dossier menu_vertical Comprenant les sous dossiers style, images, multi_niveaux, un niveau et _notes A l'intérieur du dossier un_niveau Nous créons les fichiers

Plus en détail

METTRE EN PAGE AVEC OPENOFFICE : Utiliser les outils de P.A.O.

METTRE EN PAGE AVEC OPENOFFICE : Utiliser les outils de P.A.O. METTRE EN PAGE AVEC OPENOFFICE : Utiliser les outils de P.A.O. Affichage des outils Au préalable, aller dans le menu «Affichage» > «Barre d'outils» et demander l'affichage des outils «Cadre» et «Dessin»

Plus en détail

il lui manque des images, mais au moins, elle a du style. Et elle a des liens, même s'ils ne mènent encore nulle part

<p>il lui manque des images, mais au moins, elle a du style. Et elle a des liens, même s'ils ne mènent encore nulle part </p> HTML 5 & CSS 3 1 - Le langage HTML N'utilisez pas un logiciel de traitement de texte, tels que Microsoft Word ou OpenOffice, car ils produisent des fichiers qu'un navigateur Web ne sait pas toujours lire

Plus en détail

Créer un livre électronique avec Didapages.

Créer un livre électronique avec Didapages. Créer un livre électronique avec Didapages. Lancer Didapages en double-cliquant sur son icône. Lors du premier lancement, cliquer sur Démarrer un nouveau projet. Compléter les 3 cases du haut : la première

Plus en détail

Cours 11 Feuilles de styles CSS

Cours 11 Feuilles de styles CSS École de bibliothéconomie et des sciences de l information SCI6052 Information documentaire numérique Cours 11 Faculté des arts et des sciences 22 novembre 2016 Christine Dufour, 2016 1/ 30 SCI6052 2/

Plus en détail

HTML-CSS. Claude Petitpierre, André Maurer, complété par Brice Canvel

HTML-CSS. Claude Petitpierre, André Maurer, complété par Brice Canvel HTML-CSS Claude Petitpierre, André Maurer, complété par Brice Canvel Automne 2010 ii Table des matières 1 Pages du Web 1 1.1 Introduction......................................... 1 1.2 Le langage HTML......................................

Plus en détail

INFO/RV/ Tutoriel Freemind

INFO/RV/ Tutoriel Freemind INFO/RV/10-2015 Tutoriel Freemind Table des matières 1) Lancement du logiciel... 1 2) Ajouter / supprimer une cellule / une branche... 2 3) Ajouter / supprimer des icones... 3 4) Modifier l aspect d un

Plus en détail

HTML5 et CSS3 Maîtrisez les standards de la création de sites Web (3e édition)

HTML5 et CSS3 Maîtrisez les standards de la création de sites Web (3e édition) Le HTML5 et les CSS 1. L'évolution de HTML 15 2. L'évolution des CSS 16 2.1 La notion de module 16 2.2 L'évolution des statuts 16 2.3 Les préfixes vendeurs 17 2.4 Utiliser les préfixes vendeurs 18 3. La

Plus en détail

Epicerie sociale de Wissembourg

Epicerie sociale de Wissembourg Epicerie sociale de Wissembourg Initiation à l'utilisation: Ordinateur Internet Logiciels courants Le jeudi de 14h à 15h30 Sauf information contraire Avant de commencer AVAST Installation d'un antivirus.

Plus en détail

Les Feuilles de Styles

Les Feuilles de Styles Chapitre 6 Les Feuilles de Styles http://chaker707.googlepages.com/ BEN MAHMOUD Chaker Chaker707@yahoo.fr Principe des feuilles de style Même idée que les styles des traitements de texte distinction entre

Plus en détail

Balises de formulaire

Balises de formulaire Les formulaires XHTML permettent de recueillir les informations saisies par un utilisateur, puis de les transmettre à un programme serveur. Nous verrons : - la structure d un formulaire - les éléments

Plus en détail

Utiliser la souris et le Clavier

Utiliser la souris et le Clavier Utiliser la souris et le Clavier La souris 1 Le clic gauche : a) Un seul clic gauche permet de : - sélectionner une icône sur le Bureau ou dans une fenêtre de Windows (l'icône apparaît en bleu) - dérouler

Plus en détail

ISN - HTML : Apprendre HTML5. M. Lagrave HTML5. Code source Site classique CSS Bluefish. M. Lagrave. Lycée Beaussier

ISN - HTML : Apprendre HTML5. M. Lagrave HTML5. Code source Site classique CSS Bluefish. M. Lagrave. Lycée Beaussier Lycée Beaussier 2012 2013 Sommaire Le HTML «HyperText Markup Language» est un langage de balisage pour la création de site internet, il sert à structurer votre document. D autres langages peuvent s ajouter

Plus en détail

Calculatrice virtuelle HP Prime

Calculatrice virtuelle HP Prime Calculatrice virtuelle HP Prime Référence HP : NW280-3002 Édition 2, Février 2014 Avis légal Ce manuel et tous les exemples contenus dans celui-ci sont fournis «tels quels» et sont sujets à modification

Plus en détail

IUT TC - N. Rodriguez-Destruel BALISES HTML 4.01

IUT TC - N. Rodriguez-Destruel BALISES HTML 4.01 BALISES HTML 4.01 (Référence rapide non exhaustive!) Bibliographie : Le museau numérique, http://www.laurent-bernat.com/html-balises.php3?quoi=recap_attributs HTML code tutorial, http://www.htmlcodetutorial.com

Plus en détail

Le CSS : un complément au HTML

Le CSS : un complément au HTML Le CSS : un complément au HTML CSS est l'abréviation de «Cascading Style Sheets». CSS est un langage de style qui définit la présentation des documents HTML. Par exemple, CSS couvre les polices, les couleurs,

Plus en détail