3/ ATELIER WEB LANGAGE CSS
|
|
|
- Marie-Josèphe St-Gelais
- il y a 6 ans
- Total affichages :
Transcription
1 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 de ma page HTML. C'est un langage informatique qui sert à décrire la présentation des documents HTML. On en est aujourd hui à la troisième version du langage ; le CSS3. Le CSS3 permet de déterminer, pour chaque élément de ma page html : la taille la couleur la profondeur les ombres la position... Il permet également maintenant de réaliser de petites animations. C'est dans la page CSS qu'on va attribuer un style aux textes et aux balises <div> créées précédemment.
2 ATELIER WEB CSS FONCTIONNEMENT DE QUELS LOGICIELS AI-JE BESOIN? Tout éditeur de texte ou un logiciel d'édition de sites internet tel que DREAMWEAVER permettant de créer une page texte. CRÉER UN LIEN ENTRE LA PAGE HTML ET LA PAGE CSS Pour que votre page CSS puisse dialoguer avec votre page HTML, il faut lier ces deux pages ensemble. COMMENT? Après avoir créé votre page HTML et votre page CSS dans un même dossier, il faut les lier avec la balise link dans la partie <head> du document HTML. La balise <link> : permet d'établir une connexion entre la page HTML et un élément extérieur. Dans ce cas-ci, le lien redirige vers une feuille de style ou «CSS». La feuille CSS servira à mettre en page le document. Écriture : <link rel="stylesheet" href="style.css" /> Balise link : permet de lier d autres documents à la page HTML. L'attribut rel : décrit le type de relation entre le document à lier et la page HTML. L'attribut href : indique l'adresse de destination et le nom du fichier.
3 ATELIER WEB CSS LA SYNTAXE CSS DE BASE La syntaxe de base repose sur trois éléments : Sélecteur {Propriété : valeur ;} Sélecteur : correspond à la balise HTML à mettre en forme. Propriété : correspond à la propriété CSS ; ex : taille de typo. Valeur : correspond à la valeur de la propriété ; ex : 16px. Ex : h3 { font-family: Arial; } font-style: italic Note : Les balises possédant un id sont écrites sur la feuille CSS précédées d'un «#». Les balises possédant un nom de classe sont écrites sur la feuille CSS précédées d un «.». ex : #carré et.carré
4 ATELIER WEB CSS EXEMPLE : Supposons que nous voulions que le fond d'une page Web soit noir : 1. Repérer la balise adéquate dans le document html. Balise : <body> 2. Écrire sur la feuille de style les trois éléments de CSS qui permettent d'appliquer un fond noir au body. Body { background-color: #000; } Sélecteur multiples On peut sélectionner plusieurs éléments de notre body et leur attribuer des propriétés communes. Dans l exemple qui suit les mêmes propriétés sont appliquées à h1, h2 et h3.
5 ATELIER WEB CSS LES PROPRIÉTÉS Il existe une centaine de propriétés importantes à connaître pour mettre correctement une page HTML en forme. LES PROPRIÉTÉS RELATIVES AU TEXTE : 1. font-family : Rôle : définit, sous forme de liste classée par ordre de préférence, la famille de polices à utiliser pour afficher le contenu. 2. font-size: Rôle : définit la taille de caractère de l'élément. Valeur(s) possible(s) pour cette propriété : infinie. Exemple : body {font-size: 14pt} 3. font-style: Rôle : détermine si l'élément doit être affiché en caractères normaux (Roman), italiques ou obliques. Exemple : h2 {font-style: italic} 4. text-transform : Rôle : contrôle la capitalisation du texte d'un élément. Exemple : h2 { text-transform: uppercase}
6 5. text-align: Rôle : détermine l'alignement horizontal du texte à l'intérieur d'un élément. Exemple : p {text-align: right} 6. font-weight : Rôle : définit la graisse (épaisseur) de la police de caractères à appliquer à l'élément. Exemple : p{font-weight: bolder} 7.color : Rôle : définit la couleur du texte. Exemple : H3 {color: #000080} 8.text-decoration : Rôle : permet de placer un soulignement, une ligne au-dessus, barrée ou clignotante. Exemple : a {text-decoration:none;} 9.letter-spacing Rôle : définit l'espacement entre les caractères à l'intérieur d'un élément. Exemple : a {letter-spacing: 1.1em}
7 10.word-spacing Rôle : définit l'espace entre les mots en points (pt), inches (in), centimètres (cm), pixels (px) ou pourcentages (%). P {word-spacing: 5pt} 11.line-height définit l'interligne soit l'espace entre les lignes du texte en points (pt), inches (in), centimètres (cm), pixels (px) ou pourcentages (%). P {line-height: 10pt} 12.text-indent définit un retrait dans la première ligne d'un bloc de texte souvent utilisé avec <P>. N'oubliez pas dans ce cas </P> est spécifié en pixels (px). P {text-indent: 1px}
8 ATELIER WEB CSS LES PROPRIÉTÉS RELATIVES AUX TAILLES ET POSITIONS 1.width : rôle : détermine la longueur d'un élément de texte ou d'une image. Exemple : #carré {width: 200px} 2.height : rôle : détermine la hauteur d'un élément de texte ou d'une image. Exemple : #carré {height: 200px} 3.z-index : rôle : détermine la profondeur de l'élément par rapport aux autres éléments de la page. Similaire à l'ordre des calques dans photoshop. Exemple : #carré {z-index : 200} 4.margin : margin-top détermine la valeur de la marge supérieure en unité de longueur ou auto. { margin-top: 5px } margin-right détermine la valeur de la marge droite en unité de longueur ou auto. { margin-right: 5px }
9 margin-bottom margin-left margin détermine la valeur de la marge inférieure en unité de longueur ou auto. { margin-bottom: 5px } détermine la valeur de la marge gauche en unité de longueur ou auto. { margin-left: 5px } regroupe les différentes propriétés de la marge. 5.Top, right, left et bottom : rôle : détermine la position à partir du top de la page, de la gauche de la page, de la droite de la page et du bas de la page. Exemple : #carré {top : 200px} Nécessite d'enclencher en même temps la propriété «position» Exemple : #carré { position : fixed ; top : 200px }
10 6. Position : rôle : détermine si l'élément est positionnable, et si oui, de quel type de positionnement il s'agit. Pour avoir accès aux propriétés top, bottom, left et right, il faut absolument utiliser la propriété Position. Syntaxe CSS : position: constante. Valeur(s) possible(s) pour cette propriété : Absolute : Présente tous les éléments comme s'ils n'étaient pas positionnés puis ajuste la position de l'élément en fonction des propriétés Top, right, left et bottom. La position absolue initiale se détermine par rapport au coin supérieur gauche de la fenêtre du browser. Les coordonnées de ce point sont top = 0 et left = 0. Pour positionner mon objet sur la page, j'ai accès à quatre propriétés : Top, right, left et bottom : qui peuvent être définies en : pixels (vous précisez la valeur suivie de px), pourcentage (la même chose suivie de %). Dans le graphique suivant j'ai positionné mon rectangle à 100px du top de la fenêtre
11 et à 200px du côté gauche de la fenêtre. L'écriture CSS est :#carré {position : absolute} Fixed : ne laisse pas d'espace pour l'élément. Au lieu de cela, place l élément à la position spécifiée relative à la fenêtre d'affichage, ce qui empêche le défilement lorsque la page est parcourue (ou lors de l'impression, le positionne à cette position fixe pour chaque page ). Relative : la position relative {position: relative} se détermine par rapport à d'autres éléments de la page, par exemple un élément du code Html. Shéma :
12 ATELIER WEB CSS LES PROPRIÉTÉS RELATIVES AUX FONDS 1. background-color : Rôle : définit la couleur d'arrière-plan de l'élément. Syntaxe CSS : background-color: couleur en hexadécimal ou RGB. Valeur(s) possible(s) pour cette propriété : toute spécification de couleur valide ou transparent. Exemple : p {background-color: #000} 2. background : Rôle : propriété permettant de définir, à l'aide d'une seule instruction, cinq propriétés de style d'arrière-plan : la couleur, le lien vers une image, la répétition, et les positions droites et top. Syntaxe CSS : background-color : color url('img.png') no-repeat right% top%; Valeur(s) possible(s) pour cette propriété : toute combinaison des cinq valeurs de propriété de style possibles, dans n'importe quel ordre. Exemple : body {background: #fff url('img_tree.png') no-repeat 50% 50% ;} 3. background -size : Rôle : la propriété css background-size spécifie la dimension des images d'arrière-plan. Syntaxe CSS : background-size: constante. Valeur(s) possible(s) pour cette propriété : cover, qui spécifie que l'image d'arrière-plan doit être mise à l'échelle pour être aussi petite que possible, tout en assurant que les deux dimensions soient supérieures ou égales aux dimensions de la surface de positionnement. contain, qui spécifie que l'image d'arrière-plan doit être mise à l'échelle pour être aussi grande que possible, tout en assurant que les deux dimensions soient plus petites ou égales aux dimensions de la surface de positionnement. Exemple : body {background:-size:cover}
13 ATELIER WEB CSS AUTRES PROPRIÉTÉS Opacity : La propriété de feuille de style css opacity permet de spécifier l'opacité (transparence) d'un élément. La propriété feuille de style css opacity peut prendre la valeur de nombres compris entre 0.0 et 1 ; 0.0 étant totalement transparent et 1 totalement opaque..identifiant{ opacity:0.5;} ou.identifiant{ opacity:.5;} Overflow : La propriété de feuille de style css overflow permet de gérer les dépassements de blocs (calque, champ formulaire...). La propriété de feuille de style overflow css peut prendre la valeur de : - visible, rend visible tout ce qui dépasse. - hidden, cache tout ce qui dépasse. Masque les barres de défilement horizontales et verticales. - scroll, met toujours une barre de défilement horizontale et verticale. - auto, met une barre de défilement horizontale ou verticale si besoin. - inherit, hérite de son parent (css2). overflow{ overflow : hidden;}
14 Cursor: La propriété de feuille de style css cursor permet de spécifier la forme du curseur. La propriété de feuille de style cursor css peut prendre la valeur de : - auto, - nw-resize, curseur en forme de double petite flèche en diagonale bas droit vers haut gauche, - crosshair, curseur en forme de croix fine, - n-resize, curseur en forme de double petite flèche verticale, - default, curseur en forme de grosse flèche, - se-resize, curseur en forme de double petite flèche en diagonale bas droit vers haut gauche, - pointer, curseur en forme de main avec un doigt déplié, - sw-resize, curseur en forme de double petite flèche en diagonale bas gauche vers haut droit, - move curseur en forme de quatre flèches en croix, - s-resize, curseur en forme de double petite flèche verticale, - e-resize, curseur en forme de double petite flèche horizontale, - w-resize, curseur en forme de double petite flèche horizontale, - ne-resize, curseur en forme de double petite flèche en diagonale bas gauche vers haut droit, - text, curseur ayant approximativement la forme d un grand I, - help, curseur en forme de flèche et "?", - wait, curseur en forme de sablier, - inherit, la forme du curseur hérite de son parent. - progress, curseur en forme de flèche avec sablier, - not-allowed, curseur en forme de rond barré, - no-drop, curseur en forme de main avec un doigt déplié avec un rond barré,.identifiant{ cursor : nw-resize;}
.. CSS. Damien Nouvel. Damien Nouvel (Inalco) CSS 1 / 15
.. CSS Damien Nouvel Damien Nouvel (Inalco) CSS 1 / 15 Feuilles de styles Plan 1. Feuilles de styles 2. Sélecteurs 3. Attributs Damien Nouvel (Inalco) CSS 2 / 15 Feuilles de styles Déportation des styles
Formation HTML / CSS. ar dionoea
Formation HTML / CSS ar dionoea le HTML Hyper Text Markup Language langage descriptif composé de balises interprété par le navigateur page HTML = simple fichier texte (bloc notes, vim,...) les déclarations
LES GRANDES ETAPES DE CREATION D UN WEB DESIGN
LES GRANDES ETAPES DE CREATION D UN WEB DESIGN PENSER LA STRUCTURE ET LE THEME DU SITE STRUCTURE ET THEME DU SITE Taille (le site sera-t-il extensible ou fixe?) Organisation Thème Couleurs Illustrations
Tutoriel : Feuille de style externe
Tutoriel : Feuille de style externe Vous travaillerez à partir du fichier cerise.htm que vous ouvrirez dans NVU. Commencez par remplacer le contenu de la balise Title par : Comment débuter une recherche?
1. La notion de cascade
HTML 5 et CSS 3 (partie 2) Objectifs Connaître quelques notions avancées de CSS 3, Appréhender l affichage, Introduction au Responsive Web Design. 1. La notion de cascade On constate que l on peut avoir
RESPONSIVE WEB DESIGN
RESPONSIVE WEB DESIGN Une approche pour concevoir des sites Web adaptatifs et une occasion d'inciter les étudiants à consulter des cours responsives Ivan MADJAROV Arnaud FÉVRIER Comment consulte-t-on le
Travaux dirigés n 10
Travaux dirigés n 10 IMAC 1 Responsive Web Design Dans ce TD, vous verrez comment concevoir un design web qui s adaptera au terminal sur lequel il sera visualisé. Avant-propos Avec l avènement des smartphones
Normes graphiques / Sigma Assistel / Site Internet version 1.0 / 12.11.03
version 1.0 / 12.11.03 CHOIX DE LANGUE / MESURES & GABARIT NORMES GRAPHIQUES & TYPOGRAPHIQUES 131 pixels La largeur totale du gabarit est de, 2 A ENTÊTE ET MENUS / MESURES & GABARIT NORMES GRAPHIQUES &
JOOMLA 1.5 avancé SUPPORT DE COURS + annexe
JOOMLA 1.5 avancé SUPPORT DE COURS + annexe SOMMAIRE 1. LA GESTION DES MODULES... Page 2 2. MODIFICATION DE SON TEMPLATE... Page 6 3. LA CREATION DE DIAPORAMA... Page 9 4. LA CREATION DE SONDAGE... Page
Introduction à Expression Web 2
Introduction à Expression Web 2 Définitions Expression Web 2 est l éditeur HTML de Microsoft qui répond aux standard dew3c. Lorsque vous démarrez le logiciel Expression Web 2, vous avez le choix de créer
Formation tableur niveau 1 (Excel 2013)
Formation tableur niveau 1 (Excel 2013) L objectif général de cette formation est de repérer les différents éléments de la fenêtre Excel, de réaliser et de mettre en forme un tableau simple en utilisant
Guide de réalisation d une campagne e-mail marketing
Guide de réalisation d une campagne e-mail marketing L ère des envois d e-mails en masse est révolue! Laissant la place à une technique d e-mail marketing ciblé, personnalisé, segmenté et pertinent. La
KompoZer. Composition du site : _ une page d'accueil : index.html. _ une page pour la théorie : theorie.html. _ une page pour les photos : photos.
KompoZer Créer un site «simple» Composition du site : _ une page d'accueil : index.html _ une page pour la théorie : theorie.html _ une page pour les photos : photos.html _ une page avec la galerie : galerie.html
Création d un formulaire de contact Procédure
Création d un formulaire de contact Procédure Description : Cette procédure explique en détail la création d un formulaire de contact sur TYPO3. Outil Procédure CMS: TYPO3 Auteur : hemmer.ch SA Extension:
Uniformiser la mise en forme du document. Accélère les mises à jour. Permets de générer des tables de matières automatiquement.
Les styles Table des matières Les styles... 1 1. Tutoriels... 1 2. Pourquoi utiliser les styles?... 1 3. Qu'est-ce qu'un style?... 1 4. Utiliser les styles existants... 2 Afficher les styles... 2 Appliquer
Présentation du Framework BootstrapTwitter
COUARD Kévin HELVIG-LARBRET Blandine Présentation du Framework BootstrapTwitter IUT Nice-Sophia LP-SIL IDSE Octobre 2012 Sommaire I. INTRODUCTION... 3 Définition d'un framework... 3 A propos de BootstrapTwitter...
MAILING KOMPOZER... 2 CREEZ UNE PAGE... 2 FORMAT DE LA PAGE... 2 AJOUTER DU TEXTE SUR UNE PAGE... 4
MAILING Table des matières KOMPOZER... 2 CREEZ UNE PAGE... 2 FORMAT DE LA PAGE... 2 AJOUTER DU TEXTE SUR UNE PAGE... 4 INSERER UNE IMAGE (OU UNE PHOTO) PAS DE COPIER / COLLER... 5 INSERER UN TABLEAU...
Comment insérer une image de fond?
COMMUNICATION VISUELLE Mise en page à l aide d un traitement de texte Comment insérer une image de fond? Image Plein papier ou au Format utile qu est-ce que cela veut dire? La mise en page d un document
UN SITE WEB RESPONSIVE EN UNE HEURE?
UN SITE WEB RESPONSIVE EN UNE HEURE?! O N O R H C P TO Raphaël Goetter Raphaël Goetter alsacreations.fr alsacreations.com goetter.fr knacss.com mobitest.me @goetter EN UNE HEURE, VOUS AVEZ DIT?!? R E N
Prise en main rapide
Prise en main rapide 4 Dans cette leçon, vous découvrirez les fonctionnalités de création de page web de Dreamweaver et apprendrez à les utiliser dans l espace de travail. Vous apprendrez à : définir un
HTML, CSS, JS et CGI. Elanore Elessar Dimar
HTML, CSS, JS et CGI Elanore Elessar Dimar Viamen GPAs Formation, 13 avril 2006 Sommaire Qu est-ce que HTML? HTML : HyperText Marckup Language XML : extensible Marckup Language Qu est-ce que HTML? HTML
RESPONSIVE DESIGN : Comment offrir à vos sites une adaptabilité parfaite?
RESPONSIVE DESIGN : Comment offrir à vos sites une adaptabilité parfaite? Medialibs, votre partenaire digital Quoi? Un partenaire pour une gestion globale du digital (un laboratoire R&D, éditeur de logiciels
{less} Guide de démarrage
{less Guide de démarrage Pré requis L'utilisation d'un pré processeur css nécessite son installation préalable. Vous pouvez choisir de tout installer du coté du serveur ou du coté du client. Votre site
E-MAILING & NEWSLETTER NEWSLETTER RESPONSIVE
E-MAILING & NEWSLETTER NEWSLETTER RESPONSIVE mcbenveniste@gmail.com 09/2013 E-MAILING & NEWSLETTER L e-mailing consiste à envoyer des emails simultanément à un nombre important de destinataires dont le
HTML. Notions générales
1 HTML Le langage HTML est le langage de base permettant de construire des pages web, que celles-ci soient destinées à être affichées sur un iphone/android ou non. Dans notre cas, HTML sera associé à CSS
Création de maquette web
Création de maquette web avec Fireworks Il faut travailler en 72dpi et en pixels, en RVB Fireworks étant un logiciel dédié à la création de maquettes pour le web il ne propose que les pixels pour le texte
Initiation à html et à la création d'un site web
Initiation à html et à la création d'un site web Introduction : Concevoir un site web consiste à définir : - l'emplacement où ce site sera hébergé - à qui ce site s'adresse - le design des pages qui le
Sommaire. 1/ Grille. 2/ Specs globales. 3/ Specs HP. 4/ Specs Questions. 5/ Specs Offre. 6/ Specs Faq. 7/ Comportements interactifs
Sommaire 1/ Grille 2/ Specs globales 3/ Specs HP 4/ Specs Questions 5/ Specs Offre 6/ Specs Faq 7/ Comportements interactifs 1/ Grille et breakpoints Desktop :
Utilisation de l éditeur.
Utilisation de l éditeur. Préambule...2 Configuration du navigateur...3 Débloquez les pop-up...5 Mise en évidence du texte...6 Mise en évidence du texte...6 Mise en page du texte...7 Utilisation de tableaux....7
SOUTENANCE ORALE RAPPORT DE PROJET D INFORMATIQUE
SOUTENANCE ORALE RAPPORT DE PROJET D INFORMATIQUE SITE INTERNET DE L ASSOCIATION Diapositive 1 RAPPORT DE PROJET Site internet de l association INTRODUCTION 1) Je m appelle Léonard STRONG. 2) Oral de présentation
2 LES BASES DU HTML 19 Qu est-ce que le HTML? 20 De quand date le HTML? 20 Écrire son propre code HTML 22
SOMMAIRE INTRODUCTION La collection Classroom in a Book TinyUrL Conditions requises Installation du programme Copie des fichiers Classroom in a Book ordre recommandé pour les leçons Démarrage instantané
"CREEZ VOTRE SITE WEB ET VOTRE BLOG AVEC WORDPRESS"
"CREEZ VOTRE SITE WEB ET VOTRE BLOG AVEC WORDPRESS" BONNES FEUILLES OFFERTES PAR MA-EDITIONS : "OPTIMISER" - pages à 1 OPTIMISER Partir d'un modèle existant très bien... Mais c'est encore mieux quand on
TP JAVASCRIPT OMI4 TP5 SRC1 2011-2012
TP JAVASCRIPT OMI4 TP5 SRC1 2011-2012 FORMULAIRE DE CONTACT POUR PORTFOLIO PRINCIPE GENERAL Nous souhaitons réaliser un formulaire de contact comprenant les champs suivants : NOM PRENOM ADRESSE MAIL MESSAGE
AGASC / BUREAU INFORMATION JEUNESSE 06700 Saint Laurent du Var Tel : 04.93.07.00.66 bij@agasc.fr www.agasc.fr. Word: Les tableaux.
Word: Les tableaux Introduction 6 ième partie Il est préférable par moments de présenter de l'information sous forme de tableau. Les instructions qui suivent démontrent comment créer un tableau et comment
INTRODUCTION AU CMS MODX
INTRODUCTION AU CMS MODX Introduction 1. Créer 2. Organiser 3. Personnaliser UNE PETITE INTRODUCTION QUEST-CE QU UN CMS? CMS est l acronyme de Content Management System. C est outil qui vous permet de
Pour en expliquer le principe, on se limitera à deux exemples :
Les Media Queries permettent donc de cibler : Le type de média La taille de l'écran La taille de la fenêtre La résolution Le nombre de couleurs L'orientation Pour en expliquer le principe, on se limitera
Grille fluide. Une grille fluide sert à structurer la mise en page, la rendre harmonieuse et faciliter le passage au responsive web design
Grilles Fluides CSS CREATION D UNE GRILLE FLUIDE Grille fluide Une grille fluide sert à structurer la mise en page, la rendre harmonieuse et faciliter le passage au responsive web design WWW.SUTTERLITY.FR
STID 2ème année : TP Web/PHP
STID 2ème année : TP Web/PHP Plan de travail et aide mémoire jean.arnaud@inria.fr Ce document est composé de cinq parties : Un aide mémoire sur les aspects pratiques de la création de sites Une introduction
Modules Multimédia PAO (Adobe)
Modules Multimédia PAO (Adobe) Pré-requis : Bonne maîtrise de la manipulation d'un PC (environnement Windows ou Mac) et de la navigation Internet. Disposition pour le graphisme recommandée. Mémoire visuelle,
Nouveautés de la version moodle 2.7
Nouveautés de la version moodle 2.7 Atto Éditeur de texte facile Le nouveau éditeur de texte dans Moodle à été développé spécialement pour convivialité et accessibilité. Au-dessus de la zone d'écriture
Optimiser pour les appareils mobiles
chapitre 6 Optimiser pour les appareils mobiles 6.1 Créer un site adapté aux terminaux mobiles avec jquery Mobile... 217 6.2 Transformer son site mobile en application native grâce à PhoneGap:Build...
Spécifications techniques
Spécifications techniques Décembre2009 1. Récapitulatif des formats : p2 1. Formats classiques p2 2. Formats Rich Média p2 2. Emplacements : p3 1. Directions.fr p3 2. Newsletter Directions p4 3. Contraintes
Avant-propos FICHES PRATIQUES EXERCICES DE PRISE EN MAIN CAS PRATIQUES
Avant-propos Conçu par des pédagogues expérimentés, son originalité est d être à la fois un manuel de formation et un manuel de référence complet présentant les bonnes pratiques d utilisation. FICHES PRATIQUES
Réalisez votre propre carte de vœux Éléctronique
Les différentes possibilités d animer une carte de vœux Il existe plusieurs possibilités d animer une carte de vœux : - Une Vidéo : Vous pouvez créer une vidéo, un film simplement avec Windows Media Player.
Freeway 7. Nouvelles fonctionnalités
! Freeway 7 Nouvelles fonctionnalités À propos de ce guide... 3 Nouvelles fonctionnalités en un coup d'oeil... 3 À propos de la conception d'un site web réactif... 3 Travailler avec les pages pour créer
Note de cours. Introduction à Excel 2007
Note de cours Introduction à Excel 2007 par Armande Pinette Cégep du Vieux Montréal Excel 2007 Page: 2 de 47 Table des matières Comment aller chercher un document sur CVMVirtuel?... 8 Souris... 8 Clavier
L informatique et la formation en direction des élus
L informatique et la formation en direction des élus ICE version 2.30 Edité le 30 juillet 2011 Référence Client :............ Votre Contact :............... INOVA3 Sarl au capital de 9200 Euros Siret 441761798
Edition de sites Jahia 6.6
Sommaire Edition de sites Jahia 6.6 documentation temporaire en attendant la finalisation de la documentation en ligne Ligne graphique Débuter l'édition Interface utilisateur Astuces de publication Boîte
Optimiser les e-mails marketing Les points essentiels
Optimiser les e-mails marketing Les points essentiels Sommaire Une des clés de succès d un email marketing est la façon dont il est créé puis intégré en HTML, de telle sorte qu il puisse être routé correctement
Introduction à Adobe Illustrator pour la cartographie et la mise en page
Atelier Carto. Septembre 2009 Dept. Géographie / Université de Toulouse-Le Mirail Laurent Jégou Introduction à Adobe Illustrator pour la cartographie et la mise en page Le présent support n'a pas prétention
Dévéloppement de Sites Web
1 Dévéloppement de Sites Web Cours III : Travailler avec Dreamweaver de Macromedia Peter Stockinger Séminaire de Maîtrise en Communication Interculturelle à l'institut National des Langues et Civilisations
Dans l Unité 3, nous avons parlé de la
11.0 Pour commencer Dans l Unité 3, nous avons parlé de la manière dont les designs sont créés dans des programmes graphiques tels que Photoshop sont plus semblables à des aperçus de ce qui va venir, n
PHOTOSHOP - L'AFFICHAGE
PHOTOSHOP - L'AFFICHAGE Maîtriser les différents types d'affichages Les modes d'affichages Agrandissement et réduction de l'espace de travail L'outil zoom et main / La palette de navigation Réorganisation
Sommaire : Pourquoi créer un site web? Qu est-ce qu un site Web? Les différents types de sites. Quelles solutions peuvent être employées?
Sommaire : Pourquoi créer un site web? Qu est-ce qu un site Web? Les différents types de sites Quelles solutions peuvent être employées? Présentation d une des solutions Conclusion Aujourd hui le web est
Parcours FOAD Formation EXCEL 2010
Parcours FOAD Formation EXCEL 2010 PLATE-FORME E-LEARNING DELTA ANNEE SCOLAIRE 2013/2014 Pôle national de compétences FOAD Formation Ouverte et A Distance https://foad.orion.education.fr Livret de formation
MANUEL TBI - STARBOARD
MANUEL TBI - STARBOARD TBIH MOD2 TITRE Manuel STARBOARD (Module 2) Trucs et astuces INTITULE Manuel d'utilisation du logiciel STARBOARD accompagnant le tableau blanc interactif HITACHI F-Series et FX-Series
CMS Made Simple Version 1.4 Jamaica. Tutoriel utilisateur Récapitulatif Administration
CMS Made Simple Version 1.4 Jamaica Système de gestion de contenu CMS Made Simple est entièrement gratuit sous licence GPL. Tutoriel utilisateur Récapitulatif Administration Le système de gestion de contenu
LANGAGUE JAVA. Public Développeurs souhaitant étendre leur panel de langages de programmation
ING 01 LANGAGUE JAVA Durée : 21 heures 1090 HT / jour Dates : à définir en 2012 Concevoir et développer des programmes en langage Java Comprendre le fonctionnement de la machine virtuelle S approprier
Les calques : techniques avancées
Les calques : techniques avancées 9 Au cours de cette leçon, vous apprendrez à : importer un calque d un autre fichier ; créer un masque d écrêtage ; créer et modifier un calque de réglage ; employer les
Spétechs Mobile. D e r n i è r e m i s e à j o u r : a o û t 2014
Spétechs Mobile D e r n i è r e m i s e à j o u r : a o û t 2014 Généralités Envoi des créas à Amandine Canu, responsable traffic mobile : acanu@hi-media.com Mettre en copie de votre e-mail votre contact
Tutoriel de démarrage rapide destiné aux EDITEURS
Tutoriel de démarrage rapide destiné aux EDITEURS 2007 Joseph Beeson josephbeeson@gmail.com Sous une licence Creative Commons : Paternité - Pas d'utilisation Commerciale - Partage des Conditions Initiales.
HTML5 et CSS3 pour des sites Responsive Web Design
Chapitre 1 : Introduction A. Le design Web aujourd'hui 11 B. Le Responsive Web Design 11 C. Les approches dans la conception 12 D. Le lâcher-prise 12 E. Les objectifs du livre 13 F. Les outils de l intégrateur
EXCEL TUTORIEL 2012/2013
EXCEL TUTORIEL 2012/2013 Excel est un tableur, c est-à-dire un logiciel de gestion de tableaux. Il permet de réaliser des calculs avec des valeurs numériques, mais aussi avec des dates et des textes. Ainsi
Optimiser moteur recherche
Optimiser moteur recherche Vous apprennez à inscrire vos sites dans les moteurs de recherche et les optimiser, déjà à la construction Worldsoft SA Inscription de sites Web dans les moteurs de recherche
Pack Fifty+ Normes Techniques 2013
Pack Fifty+ Normes Techniques 2013 Nos formats publicitaires par site 2 Normes techniques 2013 Display classique Pavé vidéo Footer Accueil panoramique Publi rédactionnel Quiz Jeu concours Emailing dédié
qwertyuiopasdfghjklzxcvbnmqwerty uiopasdfghjklzxcvbnmqwertyuiopas dfghjklzxcvbnmqwertyuiopasdfghjklz mqwertyuiopasdfghjklzxcvbnmqwert
qwertyuiopasdfghjklzxcvbnmqwerty uiopasdfghjklzxcvbnmqwertyuiopas dfghjklzxcvbnmqwertyuiopasdfghjklz INITIATION à Word 2007 xcvbnmqwertyuiopasdfghjklzxcvbn Cours informatiques Année 2009/2010 mqwertyuiopasdfghjklzxcvbnmqwert
SOS Info: Traitement de textes. 1. Structurer un document. 2. Enregistrer un document
De plus en plus de documents seront «lus» par des systèmes automatiques. Il est important que les textes soient parfaitement structurés pour qu'un ordinateur puisse repérer les éléments importants. On
Normes techniques 2011
Normes techniques 2011 Display classique Formats Livrables Footer p 2 p 3 p 4 Opérations spéciales Publi-rédactionnel Jeu concours Quiz Lien partenaire Habillage Accueil panoramique Sponsoring de rubrique
Créer une maquette de site Internet
Créer une maquette de site Internet La réalisation d une maquette de site Internet pour un projet nécessite une certaine rigueur, avec le souci du détail. Nous allons voir ici comment utiliser une grille
2013 Pearson France Adobe Illustrator CC Adobe Press
Au cours de cette démonstration d Adobe Illustrator CC, vous découvrirez les nouvelles fonctionnalités du logiciel, comme les outils de retouche et la sélection du texte, ainsi que d autres aspects fondamentaux
Utilisation de l'outil «Open Office TEXTE»
PRESENTATION / FORMATION Utilisation de l'outil «Open Office TEXTE» Présentation générale : OpenOffice Texte est un traitement de texte assez similaire à celui proposé par Microsoft ; il est d'ailleurs
Cours pratique Excel. Dans chacune des feuilles, les donnés sont déjà entrées afin de gagner du temps.
Cours pratique Excel Présentation du classeur cours.xls C est un classeur qui contient 7 feuilles Liste de personnes Calculs simples Solde Listes Auto Relatif Absolu Formats Paye Cours AFM Dans chacune
FrontPage Support d apprentissage septembre 2000
FrontPage Support d apprentissage septembre 2000 Table des matières Notions de base... 1 Le langage HTML... 1 Les éditeurs HTML... 1 Le navigateur... 1 Le transfert de fichiers... 1 L enregistrement des
3. RÉALISATION ET QUALIFICATION D UN PROTOTYPE 3.1 Réalisation d un prototype CRÉATION D UNE PAGE WEB STATIQUE AU FORMAT HTML
Page:1/20 CRÉATION D UNE PAGE WEB STATIQUE AU FORMAT HTML Objectifs de l activité pratique : Notions sur le HTML, le WEB et le W3C Créer une page web statique au format HTML : - les marqueurs ou balises
La Clé informatique. Formation Excel XP Aide-mémoire
La Clé informatique Formation Excel XP Aide-mémoire Septembre 2005 Table des matières Qu est-ce que le logiciel Microsoft Excel?... 3 Classeur... 4 Cellule... 5 Barre d outil dans Excel...6 Fonctions habituelles
Publication Assistée par Ordinateur
Présentation OpenOffice Draw est l'outil de dessin vectoriel de la suite bureautique OpenOffice. De fait, Draw permet de réaliser certains documents comparables à ceux de Publisher, le logiciel de P.A.O.
Nouveau Web Client marquant, Cumulus Video Cloud, optimisations de la base de données, et plus..
INFORMATION PRODUIT : Quoi de Neuf dans Cumulus 9.0? Nouveau Web Client marquant, Cumulus Video Cloud, optimisations de la base de données, et plus.. Les nouveautés marquantes et les améliorations disponibles
TP 5 Les CMS, la forme et le fond Internet et Outils (IO2)
TP 5 Les CMS, la forme et le fond Internet et Outils (IO2) Un site, tel que vous avez appris à en programmer jusqu à maintenant, contenant un ensemble de pages HTML embellies de quelques feuilles de styles,
Toute personne souhaitant maîtriser les techniques liées à la conception de produits multimédia et à la création de sites Web.
Web Designer Durée 90 jours (630 h) Public Toute personne souhaitant maîtriser les techniques liées à la conception de produits multimédia et à la création de sites Web. Objectifs La formation Web designer
Intégrateur Web HTML5 CSS3
Intégrateur Web HTML5 CSS3 L objectif de la 3W Academy est de former des petits groupes d élèves à l intégration de sites internet ainsi qu à la création d applications web simples telles qu un blog ou
1 CRÉER UN TABLEAU. IADE Outils et Méthodes de gestion de l information
TP Numéro 2 CRÉER ET MANIPULER DES TABLEAUX (Mise en forme, insertion, suppression, tri...) 1 CRÉER UN TABLEAU 1.1 Présentation Pour organiser et présenter des données sous forme d un tableau, Word propose
VOCABULAIRE LIÉ AUX ORDINATEURS ET À INTERNET
VOCABULAIRE LIÉ AUX ORDINATEURS ET À INTERNET Brancher / débrancher l ordinateur de la prise Allumer / éteindre l ordinateur : pour allumer ou éteindre l ordinateur vous devez appuyer sur le bouton On/off
INTRODUCTION A JAVA. Fichier en langage machine Exécutable
INTRODUCTION A JAVA JAVA est un langage orienté-objet pur. Il ressemble beaucoup à C++ au niveau de la syntaxe. En revanche, ces deux langages sont très différents dans leur structure (organisation du
Créer votre propre modèle
Créer votre propre modèle Vous recherchez un modèle personnalisé pour vos présentations Microsoft PowerPoint qui comprend le nom de votre organisation et un arrière-plan unique avec les couleurs et les
Chapitre 1. Prise en main
Guide de référence Guide de référence Chapitre 1. Prise en main Le processus d'enquête Le processus d'enquête comporte 5 étapes toutes prises en charge par le logiciel : Conception des formulaires Cette
Sommaire Accès via un formulaire d'identification... 4 Accès en mode SSO... 5 Quels Identifiant / mot de passe utiliser?... 6
Sommaire Accès via un formulaire d'identification... 4 Accès en mode SSO... 5 Quels Identifiant / mot de passe utiliser?... 6 2 І O2S Intégration O2S dans un site Internet Ce document présente une description
Spétechs Mobile. D e r n i è r e m i s e à j o u r : s e p t e m b r e 2 0 1 4
Spétechs Mobile D e r n i è r e m i s e à j o u r : s e p t e m b r e 2 0 1 4 Généralités Envoi des créas à Amandine Canu, responsable traffic mobile : acanu@hi-media.com Mettre en copie de votre e-mail
GUIDE Excel (version débutante) Version 2013
Table des matières GUIDE Excel (version débutante) Version 2013 1. Créer un nouveau document Excel... 3 2. Modifier un document Excel... 3 3. La fenêtre Excel... 4 4. Les rubans... 4 5. Saisir du texte
Assemblage couleur & trait en InDesign pour fichier Acrobat - 1
Assemblage couleur & trait en InDesign pour fichier Acrobat Méthode de travail pour juxtaposer le trait aux couleurs en InDesign - Trait à 600 ou 1200 dpi suivant le genre (ligne claire = 1200 trait noir
Générer un PDF avec polices incorporées
0 Générer un PDF avec polices incorporées www.imprimermonlivre.com Générer un PDF avec polices incorporées selon le logiciel ou l imprimante Edité et diffusé par Jouve, ce guide s adresse aux auteurs et
Administration du site (Back Office)
Administration du site (Back Office) A quoi sert une interface d'administration? Une interface d'administration est une composante essentielle de l'infrastructure d'un site internet. Il s'agit d'une interface
Board (Tablette) Manuel de l utilisateur. Windows 7 / XP / Vista
Board (Tablette) Manuel de l utilisateur Windows 7 / XP / Vista *Il se peut que le pilote ait déjà été mis à jour sur une version plus récente avant/après l emballage. Si votre écran d installation ne
Responsive Design. Technologies du web. Stéphane Bouvry, 2014
Responsive Design Technologies du web Stéphane Bouvry, 2014 1. Objectif Utilisation de CSS pour la mise en page 2. Diapos Le responsive design : http://goo.gl/dmh8is 3. Grille fluide Dans cette partie,
Bernard Lecomte. Débuter avec HTML
Bernard Lecomte Débuter avec HTML Débuter avec HTML Ces quelques pages ont pour unique but de vous donner les premiers rudiments de HTML. Quand vous les aurez lues, vous saurez réaliser un site simple.
MANUEL DE PROCÉDURE POUR LA MISE À JOUR DU SITE DE FIDAFRIQUE. Documentation utilisateur Octobre 2005
MANUEL DE PROCÉDURE POUR LA MISE À JOUR DU SITE DE FIDAFRIQUE Documentation utilisateur Octobre 2005 I. Principes 1.1 - Généralités Les personnes autorisées à intervenir sur le site sont enregistrées par
Le codage informatique
Outils de Bureautique Le codage informatique (exemple : du binaire au traitement de texte) PLAN 3) Le codage binaire 4) Représentation physique des bits 5) Le bit est un peu court... 6) Codage de texte