VII - Layout d interface

Save this PDF as:
 WORD  PNG  TXT  JPG

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

Download "VII - Layout d interface"

Transcription

1 Introduction à l Interaction Homme-Machine (IIHM) VII - Layout d interface.contrôler positions et dimensions.arrangement automatique Stéphane Huot Dpt. Informatique DUT Info - S

2 Attention hippies. Come out peacefully so we can smash your drug mill and all your worldly possessions..placement.dimensions.mécanismes 2

3 .placement.dimensions.mécanismes 2

4 parenthèse: interrogation écrite ( 1 feuille, 1 crayon, Nom, Prénom, TP aucun appareil, aucun document, 10 minutes écrire le code permettant de: question 1 créer et ajouter un bouton OK dans un panel pnlbouton question 2 attacher dynamiquement la procédure événementielle Click_Bouton au click sur ce bouton ) 3

5 .placement.dimensions.mécanismes 4

6 Layout arrangement des contrôles d une interface graphique respecte la logique de conception structure l interface maintien la cohérence prépare le café 5

7 placement et dimensionnement des contrôles 6

8 propriétés de placement toujours relatif au conteneur, en pixels Read / Write Read Only.Location (X,Y) (0,0).Left.Top.Right conteneur.bottom 7

9 exemple de placement Dim buttonok As New Button().Location (Interface Builder et code) buttonok.location = New Point(136, 70).Left et.top (code) buttonok.left = 136 buttonok.top = 70.Right et.bottom (lecture uniquement) buttoncancel.left = buttonok.right + 10 buttoncancel.top = buttonok.top 8

10 parenthèse: Point, Size et Rectangle ( structures de données (classes de System.Drawing) pour représenter des objets géométriques de base Point p = New Point(X, Y) Size s = New Size(W, H) Rectangle r = New Rectangle(X, Y, W, H) coordonnées entières, versions float PointF, SizeF et RectangleF méthodes et opérateurs associés (voir doc.) ) 9

11 exemple de placement Dim buttonok As New Button().Location (Interface Builder et code) buttonok.location = New Point(136, 70).Left et.top (code) buttonok.left = 136 buttonok.top = 70.Right et.bottom (lecture uniquement) buttoncancel.left = buttonok.right + 10 buttoncancel.top = buttonok.top 10

12 exemple de placement (0,0) conteneur.left 136.Top OK.Right 10 Cancel.Left

13 propriétés de dimensions dimensions absolues, en pixels.width.height 12

14 exemple de dimensions Dim buttonok As New Button().Size (Interface Builder et code) buttonok.size = New Size(200, 100).Width et.height (code) buttonok.width = 200 buttonok.height = 100 combiner placement et dimensions:.bounds buttonok.bounds = New Rectangle(136, 70, 200, 100) 13

15 autres propriétés utiles.locked (booléen) verrouille la position et les dimensions d un contrôle.margin (Thickness, All, Left, Top, Right, Bottom) marges entre les contrôles.padding (Thickness, All, Left, Top, Right, Bottom) espacement interne avec les bords d un conteneur OK OK Cancel 14

16 pourquoi faire simple quand on peut faire compliqué? le layout est sujet à beaucoup de perturbations liées à des contenus particuliers texte, listes, medias, etc. l ajout dynamique de contrôles changement de la structure de l interface des évènements particuliers au cours de l interaction redimensionnement de l interface, changement d écran / de résolution d affichage, etc. maintien de la cohérence 15

17 contenu 16

18 ajout dynamique 17

19 redimensionnement 18

20 un problème compliqué difficile de tout gérer et de tout prévoir exemple : redimensionnement de la palette de couleurs gérer les événements de redimensionnement de la fenêtre (Resize, ResizeBegin & ResizeEnd) repositionner et redimensionner tous les contrôles selon la nouvelle taille bon courage 19

21 des solutions (partielles ) structurer les composants de l interface propriétés et mécanismes pour le layout contrôles spécifiques pour la gestion du layout 20

22 structurer utiliser des conteneurs intermédiaires meilleur contrôle des placements et (re)dimensionnements ex: Panel de boutons (5,50) (105,50) OK cancel OK cancel 21

23 exemple: palette de couleurs Panel pnlcouleurs Panel pnlred Panel pnlgreen Panel pnlblack GroupBox grpchoix Label lblnomcouleur Panel pnlchoix Panel pnlboutons Button btnappliquer Button btnannuler 22

24 quand c est trop petit (ou trop grand ) Cancel OK 23

25 dimensionnement dynamique.autosize (booléen) détermine si le contrôle s adapte à la taille de son contenu.autosizemode (type AutoSizeMode) détermine comment le contrôle s adapte à la taille de son contenu AutoSizeMode.GrowOnly (défaut) Le contrôle s'agrandit autant que nécessaire pour s'adapter à son contenu mais ne diminue pas en-dessous de la valeur de sa propriété Size. Le formulaire peut être redimensionné tant que sa taille lui permet d'afficher tous les contrôles qu'il contient. AutoSizeMode.GrowAndShrink Le contrôle agrandit ou diminue sa taille pour s'adapter à son contenu. Le contrôle ne peut pas être redimensionné manuellement. ex: Button s assurer que le texte est visible et que le bouton n est pas trop grand 24

26 dimensionnement dynamique.autosize détermine si le contrôle s adapte à la taille de son contenu.autosizemode détermine comment le contrôle s adapte à la taille de son contenu AutoSizeMode.GrowOnly de la valeur de sa propriété Size. Le formulaire peut être redimensionné tant que sa taille lui permet d'afficher tous les contrôles qu'il contient. AutoSizeMode.GrowAndShrink redimensionné manuellement. Le comportement de ex: AutoSize peut varier selon le s assurer que le type texte de est contrôle visible et que le bouton n est pas trop grand 25

27 scrollbars (barres de défilement) ne concerne que les conteneurs ScrollableControl principe de viewport et défilement HScroll (booléen) rend visible/invisible la barre horizontale VScroll (booléen) rend visible/invisible la barre verticale AutoScroll (booléen) active automatiquement les barres de défilement selon le contenu 26

28 définir des contraintes sur la taille des contrôles.preferredsize (Size, lecture uniquement) taille préférentielle du contrôle par rapport au conteneur et à sa politique de gestion du layout.minimumsize (Size) définit la taille minimale que peut prendre PreferredSize.MaximumSize (Size) définit la taille maximale que peut prendre PreferredSize 27

29 définir des contraintes sur les liens du contrôle avec son conteneur.anchor (type AnchorStyles) définit les bords du conteneur auquel le contrôle et lié et les redimensionnements correspondants peut être changé dans l Interface Builder ou le code ex: btnok.anchor = AnchorStyles.None OK AnchorStyles.Top OK AnchorStyles.Top & AnchorStyles.Left OK 28

30 définir des contraintes sur les liens et le remplissage du conteneur par le contrôle.dock (type DockStyle) définit les bords du conteneur auquel le contrôle et la zone de remplissage (un seul à la fois) Top peut être changé dans l Interface Builder ou le code Fill ex: btnok.dock = DockStyle.None OK DockStyle.Top OK Left Bottom DockStyle.Fill OK Right 29

31 attention toutes les propriétés ne sont pas forcément disponibles ou n ont pas le même effet sur tous les contrôles voir la documentation 30

32 contrôles spécifiques FlowLayoutPanel TableLayoutPanel SplitContainer 31

33 conteneurs spécifiques: FlowLayoutPanel arrange ses éléments horizontalement ou verticalement Dim FlowLayoutPanel flwpanel As New FlowLayoutPanel.FlowDirection (type FlowDirection) définit la direction du flux des contrôles contenus FlowDirection.LeftToRight et aussi RightToLeft et BottomUp FlowDirection.TopDown voir la documentation 32

34 conteneurs spécifiques: TableLayoutPanel arrange ses éléments dans une table (lignes et colonnes) Dim TableLayoutPanel tblpanel As New TableLayoutPanel les paramètres de la table (% d espace pris par les cellules) peuvent être spécifiés dans l InterfaceBuilder ou dans le code.columncount &.RowCount obtient et définit la taille de la table.growstyle (TableLayoutPanelGrowStyle.[FixedSize AddColumns AddRows]) spécifie si et comment la table peut grandir lors de l ajout de contrôles voir la documentation 33

35 conteneurs spécifiques: SplitContainer conteneur avec deux zones séparées par une barre mobile Dim SplitContainer splpanel As New SplitContainer.SplitterDistance (Integer) définit la distance entre le splitter et la gauche (ou le haut) du conteneur.orientation (type Orientation) définit l orientation de la séparation Orientation.Vertical Orientation.Horizontal voir la documentation 34

36 le layout problème(s) très complexe certains problèmes ne sont même pas encore résolus avec les outils de programmation d interfaces nécessite de l expérience et de la pratique combiner les contrôles spécifiques, propriétés, méthodes peut varier selon les boîtes à outils (.NET, Java Swing, Qt, etc.) quand vous voulez faire plus voir la documentation 35

12. LES MISES EN PAGE FLUIDES (LIQUIDES ET ELASTIQUES)

12. LES MISES EN PAGE FLUIDES (LIQUIDES ET ELASTIQUES) 119 12. LES MISES EN PAGE FLUIDES (LIQUIDES ET ELASTIQUES) Pour rappel, il existe trois grands principes de mise en page 1 : Fixe le design possède une largeur fixe exprimée le plus souvent en pixels.

Plus en détail

TP 1 : 1 ère APPLICATION AVEC VISUAL STUDIO (C#)

TP 1 : 1 ère APPLICATION AVEC VISUAL STUDIO (C#) TP 1 : 1 ère APPLICATION AVEC VISUAL STUDIO (C#) OBJECTIFS : Prise en main de l'environnement de programmation Visual Studio 2008. A. Création et lancement d'un projet: La version.net de Visual Studio

Plus en détail

Informations sur les composants principaux de Visual Basic

Informations sur les composants principaux de Visual Basic Informations sur les composants principaux de Visual Basic Généralités Les composants de Visual Basic feuille ou contrôles sont identifiés à partir de leurs noms. Ces noms sont donnés au cours de la phase

Plus en détail

PARTIE 3 STRUCTURE PRESENTATION ELEMENT CALCULÉ

PARTIE 3 STRUCTURE PRESENTATION ELEMENT CALCULÉ PARTIE 3 STRUCTURE PRESENTATION ELEMENT CALCULÉ mardi, 14 mai, 2002 1 Structure d un formulaire... 3 L utilisation des données... 5 L utilisation des tables... 5 L utilisation des éléments liés... 6 Le

Plus en détail

Université Paris Dauphine Outils de l Internet 2011-2012 TP 5 : LES CADRES

Université Paris Dauphine Outils de l Internet 2011-2012 TP 5 : LES CADRES TP 5 : LES CADRES Le contenu de la page d'accueil d'un site ne constitue que la subdivision en plusieurs frames. Les codes sources de chacune des frames seront contenus dans d'autres fichiers HTML. La

Plus en détail

7.1 Introduction à la navigation... 204 7.2 Manipuler une ViewStack... 204 7.3 Les contrôles TabNavigator et Accordion... 215 7.4 Mise en pratique :

7.1 Introduction à la navigation... 204 7.2 Manipuler une ViewStack... 204 7.3 Les contrôles TabNavigator et Accordion... 215 7.4 Mise en pratique : 7 7.1 Introduction à la navigation... 204 7.2 Manipuler une ViewStack... 204 7.3 Les contrôles TabNavigator et Accordion... 215 7.4 Mise en pratique : mon CV en ligne... 218 7.5 Check-list... 225 Naviguer

Plus en détail

Conception de documents et d interfaces numériques

Conception de documents et d interfaces numériques CAEN 2016-2017 Conception de documents et d interfaces numériques TD n 10 WEB Les Feuilles de styles CSS 2 ANNE Jean-François D après le cours de Mme DRAFATE Style des tableaux Feuilles de Style (CSS)

Plus en détail

1. Préparation des photos

1. Préparation des photos L HABILLAGE DES PHOTOS Nous mettons à votre disposition un kit complet pour réaliser l habillage de vos photos. Le kit fourni est : - kit «hab ClubRIT_incrust_photo» Il contient le fichier «siglerit_incrustphoto.png»

Plus en détail

1 Présentation Interface graphique Schéma général du programme Lectures complémentaires... 3

1 Présentation Interface graphique Schéma général du programme Lectures complémentaires... 3 Chapitre 8 Interface graphique Table des matières Table des matières 1 1 Présentation 2 1.1 Interface graphique............................. 2 1.2 Schéma général du programme...................... 2 1.3

Plus en détail

Capsules de formation OpenOffice.org Catégorie C (Tableur)

Capsules de formation OpenOffice.org Catégorie C (Tableur) Capsules de formation OpenOffice.org Catégorie C (Tableur) Section 07 : Insertion de diagrammes Notions C0701 à C0707 Version du 2005-12-06 Table des matières Notion C0701 Création de différents types

Plus en détail

Excel 2003 Fonctions avancées

Excel 2003 Fonctions avancées Chapitre 1 Excel 2003 Fonctions avancées Table des matières Personnalisation du logiciel Personnalisation de l environnement Excel... 2 Modification des paramètres généraux... 3 Modification des paramètres

Plus en détail

COMPOSANTS. Géry Casiez IHM Master 1 informatique - Université de Lille 1

COMPOSANTS. Géry Casiez  IHM Master 1 informatique - Université de Lille 1 1 COMPOSANTS Géry Casiez http://www.lifl.fr/~casiez IHM Master 1 informatique - Université de Lille 1 2 Composants de la plateforme Java La librairie AWT 3 La librairie AWT (Abstract Window Toolkit) a

Plus en détail

ACCESS 2010 MICROSOFT D R Y A O K. P A T R I C K

ACCESS 2010 MICROSOFT D R Y A O K. P A T R I C K ACCESS 2010 MICROSOFT D R Y A O K. P A T R I C K MISE EN ROUTE DE ACCESS 2010 1) Définitions - Composition d une base de données Access Table : une table regroupe des données de même nature. Requête :

Plus en détail

LibreOffice Découvrir Le tableur Calc (1)

LibreOffice Découvrir Le tableur Calc (1) L INTERFACE LibreOffice Découvrir Le tableur Calc (1) Ce document présente quelques fonctionnalités du tableur CALC. Ouvrez une feuille de calcul et suivez les indications. Les données à saisir sont repérées

Plus en détail

WORD. Tableaux Bordures & trames Outils de dessins & graphiques

WORD. Tableaux Bordures & trames Outils de dessins & graphiques WORD Tableaux Bordures & trames Outils de dessins & graphiques Les tableaux Créer un tableau (1) Par la barre d outil Placer le curseur à l endroit où le tableau doit être inséré Cliquer sur le bouton

Plus en détail

1.1 Introduction Les bases de XAML Les éléments de structure Les éléments de contenu Les événements et leur

1.1 Introduction Les bases de XAML Les éléments de structure Les éléments de contenu Les événements et leur 1 1.1 Introduction... 24 1.2 Les bases de XAML... 24 1.3 Les éléments de structure... 26 1.4 Les éléments de contenu... 35 1.5 Les événements et leur traitement... 38 1.6 Les éléments d interactions...

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

Editeur Visuel Eclipse

Editeur Visuel Eclipse Editeur Visuel Eclipse Ce document est une présentation rapide de l'éditeur visuel d'interfaces Java sous Eclipse. Le lecteur est invité à lancer Eclipse, et à lire le document, en testant ce qu'il lit,

Plus en détail

Chapitre 5 : Menu Affichage

Chapitre 5 : Menu Affichage Menu Affichage 5-1 5 : Menu Affichage Menu Affichage Le menu Affichage est l un des menus permanents de Finale. Ce qu il permet Ce menu contient des commandes gérant l affichage sur l écran de votre partition.

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

Table des matières TABLE DES MATIÈRES

Table des matières TABLE DES MATIÈRES iii TABLE DES MATIÈRES Leçon 1 Démarrer et explorer Excel... 1 1.045 Qu est-ce que Microsoft Excel?... 2 1.050 Démarrer Microsoft Excel... 2 1.060 Identifier les éléments de la fenêtre d Excel... 3 1.065

Plus en détail

TRAITEMENT DE TEXTE. 1.1 Séquence 1 : SE FAMILIARISER AVEC SON ENVIRONNEMENT DE TRAVAIL

TRAITEMENT DE TEXTE. 1.1 Séquence 1 : SE FAMILIARISER AVEC SON ENVIRONNEMENT DE TRAVAIL TRAITEMENT DE TEXTE 1 Scénario 1.1 Séquence 1 : SE FAMILIARISER AVEC SON ENVIRONNEMENT DE TRAVAIL 1.1.1 Objectifs specifiques A la fin de cet élément d apprentissage, l apprenant sera en mesure de : -

Plus en détail

BDW1 - Programmation web - CSS

BDW1 - Programmation web - CSS BDW1 - Programmation web - CSS Fabien Duchateau fabien.duchateau [at] univ-lyon1.fr Université Claude Bernard Lyon 1 2016-2017 http://liris.cnrs.fr/fabien.duchateau/ens/bdw1/ Positionnement dans BDW1 BDW1

Plus en détail

Mettre sous forme de tableau. Sommaire

Mettre sous forme de tableau. Sommaire MICROSOFT EXCEL Révision Juin 2015 Mettre sous forme de tableau 1. Introduction... 2 2. Choisir un style de tableau lors de la création d un tableau... 2 3. Supprimer un style de tableau... 3 4. Créer

Plus en détail

FICHE 9 : CREER UNE DIAPOSITIVE AVEC UN TABLEAU

FICHE 9 : CREER UNE DIAPOSITIVE AVEC UN TABLEAU FICHE 9 : CREER UNE DIAPOSITIVE AVEC UN TABLEAU Le 2 ème grand type de diapositive est celui où on insère un tableau. 1. CREER UN TABLEAU 1.1 AVEC UN ESPACE RESERVE SUR UNE DIAPOSITIVE - Choisissez comme

Plus en détail

Carrefour de l information Université de Sherbrooke. Dreamweaver MX 2004 Deuxième partie Savoir améliorer ses sites Web

Carrefour de l information Université de Sherbrooke. Dreamweaver MX 2004 Deuxième partie Savoir améliorer ses sites Web Carrefour de l information Université de Sherbrooke Dreamweaver MX 2004 Deuxième partie Savoir améliorer ses sites Web Par : Josée Martin (hiver 2005) Édition revue et augmentée par : Marc-André Dulude

Plus en détail

Foundation 6 Un framework CSS pour concevoir des sites web attractifs et adaptatifs

Foundation 6 Un framework CSS pour concevoir des sites web attractifs et adaptatifs Chapitre 1 : Introduction A. Le développement des sites web 9 B. Les fonctionnalités de Foundation 10 C. Télécharger les exemples 11 Chapitre 2 : Installer Foundation A. Les objectifs 15 B. Les différentes

Plus en détail

Contenu Excel Module 1 Environnement. Module 3 Formules de calcul. Module 2 Premiers pas avec Excel. -i-

Contenu Excel Module 1 Environnement. Module 3 Formules de calcul. Module 2 Premiers pas avec Excel. -i- Contenu Excel 2003 Module 1 Environnement Chiffrier électronique Configuration de Windows Microsoft Excel 2003 Lancement d'excel Bureau d'excel Barre de titre Barre des menus Barres d'outils Barre de formule

Plus en détail

Date Version Auteur Notes 14/09/ Direction Informatique Création. Portail Zimbra. Aide utilisateur

Date Version Auteur Notes 14/09/ Direction Informatique Création. Portail Zimbra. Aide utilisateur Date Version Auteur Notes 14/09/2014 1.1 Direction Informatique Création Portail Zimbra Aide utilisateur Ce document explique le fonctionnement du portail Zimbra, comment l utiliser et le personnaliser.

Plus en détail

Balises de tableau. - choisir des bordures à afficher - contrôler le quadrillage des cellules - traiter séparément les sections (en-tête, corps, pied)

Balises de tableau. - choisir des bordures à afficher - contrôler le quadrillage des cellules - traiter séparément les sections (en-tête, corps, pied) Les tableaux XHTML ne sont pas qu un bon moyen de présenter l information, mais aussi un bon outil de mise en page Les tableaux permettent de - choisir des bordures à afficher - contrôler le quadrillage

Plus en détail

ENVIRONNEMENT NUMÉRIQUE. LA MACHINE Découvrons Exerçons-nous Récapitulons Approfondisons

ENVIRONNEMENT NUMÉRIQUE. LA MACHINE Découvrons Exerçons-nous Récapitulons Approfondisons ENVIRONNEMENT NUMÉRIQUE LA MACHINE Découvrons Exerçons-nous Récapitulons Approfondisons Souris la position déplacer bien tenir la souris les différentes souris les boutons cliquer les boutons les gauchers

Plus en détail

Contenu Access 2013 MODULE 1 ENVIRONNEMENT ACCESS 2013 MODULE 2 TABLES MODULE 3 PROPRIÉTÉS DES CHAMPS. -i-

Contenu Access 2013 MODULE 1 ENVIRONNEMENT ACCESS 2013 MODULE 2 TABLES MODULE 3 PROPRIÉTÉS DES CHAMPS. -i- Contenu Access 2013 MODULE 1 ENVIRONNEMENT ACCESS 2013 FICHIERS D APPRENTISSAGE LOGICIEL ACCESS 2013 BASE DE DONNÉES LANCEMENT D ACCESS 2013 OUVERTURE D UNE BASE DE DONNÉES FERMETURE D UNE BASE DE DONNÉES

Plus en détail

Introduction à Android. 1. Création d'une première application

Introduction à Android. 1. Création d'une première application Introduction à Android 1. Création d'une première application 1. Dans Eclipse, créer un nouveau Projet Android (File/New Project/ Android /Android Project nommé TP01_AndroidActivity dans le package MesTp.Pack.

Plus en détail

Guide d usager Septembre 2014

Guide d usager Septembre 2014 L permet aux commissions scolaires, aux divers organismes et au public en général d'accéder aux cartes relatives aux indices de défavorisation du ministère de l'éducation, du Loisir et du Sport. Cet outil

Plus en détail

Microsoft Excel Conseils

Microsoft Excel Conseils Microsoft Excel Conseils Sommaire Organiser les feuilles de calcul (sheets)... 1 Renommer les feuilles de calcul... 1 Changer la couleur de l onglet pour la feuille de calcul... 1 Insérer un nouvelle feuille

Plus en détail

Module II : Les logiciels 2014 /2015 Tronc commun. Logo Excel 2003 Logo Excel 2007

Module II : Les logiciels 2014 /2015 Tronc commun. Logo Excel 2003 Logo Excel 2007 I. Introduction : Chapitre 3 : Tableur 1. Notion d un tableur : Un tableur est un logiciel permettant d effectuer automatiquement des calculs sur des données stockées dans un tableau. 2. Avantage des tableurs

Plus en détail

4. LES TRANSITIONS EN CSS3

4. LES TRANSITIONS EN CSS3 151 4. LES TRANSITIONS EN CSS3 Les CSS3 permettent, avec le module Transition de passer d une valeur CSS à une autre avec une transition spécifiée si un événement est détecté au niveau d un élément. Concrètement,

Plus en détail

WORD PARTIE 4

WORD PARTIE 4 V. PARTIE 4 1 LE TABLEAU La conception du tableau est basée sur la notion de cellule. Il est adapté à la présentation de listes et pour cela remplace avantageusement les tabulations ; il permet aussi de

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

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

1.Choisir une page modèle.

1.Choisir une page modèle. 1.Choisir une page modèle. ( Cliquez sur DESIGN ) En cliquant sur les flèches, vous avez le choix entre: 1. New presentation 2. Slide layout 3. Slide design New presentation: Permet de créer une nouvelle

Plus en détail

1 Prendre en main l interface et créer ses premiers courriers... 15

1 Prendre en main l interface et créer ses premiers courriers... 15 1 Prendre en main l interface et créer ses premiers courriers... 15 1.1. Tour d horizon... 16 Démarrer Word 2003... 16 Saisir un texte... 19 Appliquer quelques mises en forme... 21 Visualiser le document

Plus en détail

Boîtes à outils d interface

Boîtes à outils d interface Boîtes à outils d interface Michel Beaudouin-Lafon Laboratoire de Recherche en Informatique Université Paris-Sud / CNRS mbl@lri.fr http://insitu.lri.fr Plan Couches logicielles Librairies graphiques Systèmes

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 <head> 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

Nom & #Étudiant Travail 8 Macros dimanche, 6 avril 2008 INSTRUCTIONS POUR LE TRAVAIL 8 / 10 POINTS

Nom & #Étudiant Travail 8 Macros dimanche, 6 avril 2008 INSTRUCTIONS POUR LE TRAVAIL 8 / 10 POINTS INSTRUCTIONS POUR LE TRAVAIL 8 / 10 POINTS DESCRIPTION DU TRAVAIL : Dans ce travail, vous devez lire les notes sur les macros et vous devez créer 10 macros en respectant les exigences ci-dessous : Toutes

Plus en détail

FITZCO MULTIMEDIA. Excel Les bases

FITZCO MULTIMEDIA. Excel Les bases FITZCO MULTIMEDIA Excel 2007 Les bases Les bases 2 Sommaire SÉLECTIONNER DES CELLULES : MÉTHODE 1... 3 SÉLECTIONNER DES CELLULES : MÉTHODE 2... 4 SÉLECTIONNER DES CELLULES : MÉTHODE 3... 5 SÉLECTIONNER

Plus en détail

Dr Aser J. BODJRENOU / Dernière mise à jour : Juillet 2008 Ce document s adresse à tous les apprenants ayant un prérequis en MS Word Objectifs

Dr Aser J. BODJRENOU / Dernière mise à jour : Juillet 2008 Ce document s adresse à tous les apprenants ayant un prérequis en MS Word Objectifs SUPPORT DE COURS SUR LE MODULE EXCEL Dr Aser J. BODJRENOU / Dernière mise à jour : Juillet 2008 Ce document s adresse à tous les apprenants ayant un prérequis en MS Word Objectifs spécifiques : Démarrer

Plus en détail

Pascal Cristofoli. Laboratoire de démographie et d histoire sociale. - Ecole d été L analyse des réseaux - Lille, 2 juillet 2013

Pascal Cristofoli. Laboratoire de démographie et d histoire sociale. - Ecole d été L analyse des réseaux - Lille, 2 juillet 2013 - Ecole d été L analyse des réseaux - Lille, 2 juillet 2013 Pascal Cristofoli Laboratoire de démographie et d histoire sociale CRH-UMR 8558 EHESS-CNRS Ecole des hautes études en sciences sociales Ce document

Plus en détail

CSS3 Adoptez les feuilles de style pour maîtriser les standards du web

CSS3 Adoptez les feuilles de style pour maîtriser les standards du web Utiliser les Cascading Style Sheets 1. Les objectifs du livre 13 2. L'évolution des CSS 14 2.1 Les modules CSS3 14 2.2 Les étapes dans la conception des CSS3 15 3. Les préfixes des navigateurs 19 4. Le

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

Mémo CSS 3. Exemple : h1 concerne toutes les éléments titres de niveau 1 <h1> de la page.

Mémo CSS 3. Exemple : h1 concerne toutes les éléments titres de niveau 1 <h1> de la page. Mémo CSS 3 Les sélecteurs simples balise permet de viser tous les éléments d un certain type de balise. Exemple : h1 concerne toutes les éléments titres de niveau 1 de la page..maclasse permet de

Plus en détail

Palo Altours. Cours 2016 Peter Bardu

Palo Altours. Cours 2016 Peter Bardu Palo Altours Mon Parcours 2010 - Ingénieur en informatique à Polytech Tours. 2013 - Validation Formateur CEFIM Tours 2015 - Validation Formateur CCI Indre 2016 - Validation Formateur Orsys 2016 - Validation

Plus en détail

Table des matières v iii. Table des matières

Table des matières v iii. Table des matières Table des matières v iii Table des matières Chapitre 1 Introduction à PowerPoint Qu est-ce que PowerPoint? 2 Lancement de PowerPoint 2010 3 Exploration de la fenêtre PowerPoint 4 Exploration du ruban 5

Plus en détail

GUIDE DE L UTILISATEUR

GUIDE DE L UTILISATEUR GUIDE DE L UTILISATEUR CHENELIÈRE ÉDUCATION EST FIÈRE DE VOUS PRÉSENTER LA SEULE PLATEFORME NUMÉRIQUE CONÇUE POUR LE PRIMAIRE. Notre plateforme interactive avant-gardiste et unique en son genre vous offre

Plus en détail

Test Test Test Test Test

Test Test Test Test Test Mise en forme d un document HTML Niveaux de titre Le langage HTML définit 6 niveaux de titre (en anglais heading), afin de définir une structuration hiérarchique des paragraphes dans un texte : Balise

Plus en détail

Table des matières Section Word

Table des matières Section Word Table des matières v iii Table des matières Section Word Lancement de Word Qu est-ce qu un traitement de textes? 2 Lancement de Word 2 Exploration de la fenêtre Microsoft Word 3 Exploration du ruban 4

Plus en détail

Architecture d'un programme interactif graphique. Objectifs: Organiser un projet selon Model-View-Controller Dessin 2D avec OPENGL

Architecture d'un programme interactif graphique. Objectifs: Organiser un projet selon Model-View-Controller Dessin 2D avec OPENGL Architecture d'un programme interactif graphique Objectifs: Organiser un projet selon Model-View-Controller Dessin 2D avec OPENGL Plan: - Les 3 types de dialogue utilisateur - Approche Model-View-Controller

Plus en détail

Microsoft Excel 2013

Microsoft Excel 2013 Sélection de leçons de tableur Avec Microsoft Excel 2013 Par Sylvain Millaire Formation SMI inc. Pour commander, adressez-vous à : ii FORMATION SMI Téléphone : (514) 823-8560 Télécopie : (450) 628-5990

Plus en détail

CE1 Reproduction sur un quadrillage

CE1 Reproduction sur un quadrillage CE1 Reproduction sur un quadrillage Domaine : Mathématiques (géométrie) Compétences : repérer et coder des cases ou des nœuds sur un quadrillage Objectifs spécifiques : - Reproduire un dessin sur un quadrillage

Plus en détail

8 Puces et indentations

8 Puces et indentations 8 Puces et indentations Une palette «liste» proposant des mises en forme est à disposition dans l espace privé, toutefois voilà le codage à faire si vous souhaitez indenter le texte différemment ou l indenter

Plus en détail

Microsoft Excel 2007 (suite) INF0326 Outils bureautiques, logiciels et Internet

Microsoft Excel 2007 (suite) INF0326 Outils bureautiques, logiciels et Internet Microsoft Excel 2007 (suite) INF0326 Outils bureautiques, logiciels et Internet Plan Analyser des données (suite et fin) graphiques tableaux croisés dynamiques Gérer des classeurs Excel Les graphiques

Plus en détail

Table des matières iii. Table des matières

Table des matières iii. Table des matières Table des matières iii Table des matières Chapitre 1 Apprendre la méthode de doigté Introduction 4 Clavier 4 Ergonomie 6 Position du corps 6 Position devant l écran 6 Soins des yeux 6 Position des mains

Plus en détail

Tableur 2012 /2013. Tableur

Tableur 2012 /2013. Tableur Tableur I. Rappel de quelques fonctions de base : Activité 1 : Réponse : 1). 0) Démarche à suivre pour enregistrer un document tableur. 1) Activer le menu "Fichier" 2) Choisir la commande "Enregistrer".

Plus en détail

Embird Point de croix Créer un simple motif

Embird Point de croix Créer un simple motif Embird Point de croix Créer un simple motif ********************************************************************** Tutoriel traduit par Lamamie à partir du lien : http://www.embird.com/sw/embird/tutorial/xwork/xwork.htm

Plus en détail

Sommaire. Chapitre 1 > Découverte de l environnement Microsoft Access Chapitre 2 > Créer et gérer des tables... 41

Sommaire. Chapitre 1 > Découverte de l environnement Microsoft Access Chapitre 2 > Créer et gérer des tables... 41 Chapitre 1 > Découverte de l environnement Microsoft Access 2003.. 13 1.1 Définition d une base de données... 15 1.2 Composantes d Access... 16 Les tables... 17 Les requêtes... 19 Les formulaires... 21

Plus en détail

L insertion d images

L insertion d images Fiche 01 L insertion d images INSÉRER UNE IMAGE Dans le ruban, Menu Insertion >>> Illustrations Ensuite, sélectionner le type de graphique à insérer DÉPLACER UNE IMAGE Cliquer sur le graphique avec la

Plus en détail

1 L environnement... 15

1 L environnement... 15 1 L environnement... 15 1.1. Lancer l application... 16 1.2. Créer un raccourci sur le Bureau... 17 1.3. Les touches du clavier... 17 Minuscules, Majuscules et Alt Gr... 18 Les combinaisons de touches...

Plus en détail

2. Premier enregistrement dans un répertoire spécifique et titre de page

2. Premier enregistrement dans un répertoire spécifique et titre de page Tutoriel Kompozer 1. Ouverture et configuration de l'interface Lors de la première ouverture, l'interface est comme à l'image 1a. À chaque démarrage, il y a une fenêtre d'astuces qui vous donne des trucs

Plus en détail

MISE EN PAGE DE L IMPRESSION DANS EXCEL 2007

MISE EN PAGE DE L IMPRESSION DANS EXCEL 2007 MISE EN PAGE DE L IMPRESSION DANS EXCEL 2007 Utiliser le mode Mise en page pour peaufiner la présentation des pages avant l impression Avant d imprimer une feuille de calcul Microsoft Office Excel contenant

Plus en détail

Tableur. Syllabus version 5.0

Tableur. Syllabus version 5.0 Syllabus version 5.0 Copyright 2016 ECDL Foundation Tous droits réservés. Cette publication ne peut être utilisée que dans le cadre de l initiative ECDL. Responsabilité ECDL Foundation a produit cette

Plus en détail

Utilisation des tableaux dans Dreamweaver

Utilisation des tableaux dans Dreamweaver Utilisation des tableaux dans Dreamweaver Ecole-Club Migros Alain Court Usages des tableaux Le tableau en HTML a été la première réponse aux besoins de mise en page. En effet, le langage HTML n'est pas

Plus en détail

Réaliser un publipostage

Réaliser un publipostage Réaliser un publipostage Introduction au publipostage Le publipostage est la fusion d un document type (appelé document principal) avec un fichier qui représente un tableau (appelé source de données).

Plus en détail

GUIDE TECHNIQUE DE MISE EN ŒUVRE D UNE FORMATION A DISTANCE CENTRA

GUIDE TECHNIQUE DE MISE EN ŒUVRE D UNE FORMATION A DISTANCE CENTRA rectorat mission formation division de la formation GUIDE TECHNIQUE DE MISE EN ŒUVRE D UNE FORMATION A DISTANCE CENTRA 1 TYPES DE FORMATION (Individuelle, d équipe) L objet de ce document est de présenter

Plus en détail

FICHE TECHNIQUE : OpenOffice.org «CALC»

FICHE TECHNIQUE : OpenOffice.org «CALC» FICHE TECHNIQUE : OpenOffice.org «CALC» 1 Sommaire I /LE TABLEUR...3 1.1.Qu'est-ce qu'un tableur?...3 1.2.Prise en main...3 1.2.1.Saisir des informations...4 1.2.2. Modifier le contenu d'une cellule...5

Plus en détail

Programmation web & mobile d applications géomatiques

Programmation web & mobile d applications géomatiques Programmation web & mobile d applications géomatiques SCG-67216 Technologies pour réaliser des applications géospatiales communicantes Architectures Web, J2EE et Servlets Thierry Badard & Frédéric Hubert

Plus en détail

Styler un formulaire avec Dreamweaver cs5. MC Benveniste

Styler un formulaire avec Dreamweaver cs5. MC Benveniste Styler un formulaire avec Dreamweaver cs5 MC Benveniste 2013 Styler un formulaire Formulaire de base Formulaire avec les css Styler un formulaire Un formulaire contient des balises : pour les étiquettes

Plus en détail

2E Révision introduction au Tableur > 2) La cellule

2E Révision introduction au Tableur > 2) La cellule Objectifs de ce module Je serai capable... de changer les polices et la taille des caractères dans les cellules ou plages de cellules d utiliser des styles différents d aligner les cellules (gauche, centré,

Plus en détail

ACCESS 2013 Niveau débutant

ACCESS 2013 Niveau débutant ACCESS 2013 Niveau débutant OBJECTIF À la fin de la formation, le participant sera en mesure de manipuler des bases de données. CLIENTÈLE VISÉE Tout public PRÉALABLES Connaissance de Windows PLAN DE FORMATION

Plus en détail

Présentation Isabelle Stephan

Présentation Isabelle Stephan L ENVIRONNEMENT D EXCEL Descriptif des différents éléments : Barre de Titre (a) : Cette barre vous indique le nom du document ouvert (ici classeur1) ainsi que le nom de l'application (Excel). Cette barre

Plus en détail

Microsoft Excel 2013

Microsoft Excel 2013 Leçons de tableaux et graphiques Avec Microsoft Excel 2013 Par Sylvain Millaire Formation SMI inc. Pour commander, adressez-vous à : ii FORMATION SMI Téléphone : (514) 823-8560 Télécopie : (450) 628-5990

Plus en détail

Interaction Homme-Machine. Un système de "Post-It Notes"

Interaction Homme-Machine. Un système de Post-It Notes DESS GI Examen décembre 1997 Interaction Homme-Machine durée : 3 heures Tout document permis Si le sujet présente des ambiguïtés, précisez vos choix. Il sera tenu compte de vos hypothèses. Un système de

Plus en détail

PAGE D ACCUEIL. Carte de navigation : Barre d'outils (1) Légende. Onglets déroulants (2)

PAGE D ACCUEIL. Carte de navigation : Barre d'outils (1) Légende. Onglets déroulants (2) 1 PAGE D ACCUEIL Carte de navigation : Titre de la carte Ouverture / fermeture par bouton ou Description de la carte Barre d'outils (1) Légende Onglets déroulants (2) Informations sur la carte : Échelle

Plus en détail

Fiche Interface du tableur. Table des matières

Fiche Interface du tableur. Table des matières Fiche Interface du tableur Table des matières 1-Interface...1 2-Barres d'outils...2 3- Cellules...8 3.1-Onglet «Nombres»...8 3.2-Onglet «Police»...9 3.3-Onglet «Effets de caractère»...9 3.4-Onglet «Alignement»...10

Plus en détail

TP1 : Tâtons le terrain

TP1 : Tâtons le terrain 1 Première animation Avant de se lancer dans le dessin, il vaut mieux préparer le terrain, pardon l animation. 1.1 Préparer le terrain Ouvrez un nouveau document par l icône de la barre Principale, ou

Plus en détail

Atelier N 1 : Système d exploitation

Atelier N 1 : Système d exploitation Atelier N 1 : Système d exploitation Activité1 : Remplir le tableau suivant Gestion= (mémoires, fichiers, programmes, périphériques) Contenu : voir l ordinateur. Eléments d un S.E Contenu Gestion Mes documents

Plus en détail

PhotoFiltre en bref DETAILS

PhotoFiltre en bref DETAILS Fiche 2 PhotoFiltre en bref PhotoFiltre est un logiciel de retouche d images très complet. PhotoFiltre est gratuit pour une utilisation privée, non commerciale ou éducative (incluant les organisations

Plus en détail

PRODUCTION DE DOCUMENTS POUR LA FABRICATION D UN CIRCUIT IMPRIIME

PRODUCTION DE DOCUMENTS POUR LA FABRICATION D UN CIRCUIT IMPRIIME PRODUCTION DE DOCUMENTS POUR LA FABRICATION D UN CIRCUIT IMPRIIME Votre travail sera terminé lorsque vous aurez produit l ensemble des documents informatiques né cessaires à la fabrication d un circuit

Plus en détail

HTML, CSS. Rapide Présentation Anthony Médassi Résumé OpenClassRoom

HTML, CSS. Rapide Présentation Anthony Médassi Résumé OpenClassRoom HTML, CSS Rapide Présentation Anthony Médassi Résumé OpenClassRoom HTML Pour le fond -> HTML Pour la forme -> CSS Les balises Les balises orphelines Attributs de balise LES BALISES PRINCIPALES HTML

Plus en détail

Consignes pour la forme numérique d un document :

Consignes pour la forme numérique d un document : Consignes pour la forme numérique d un document : Sommaire : 1 Word 2003/2005 (type de fichier : point doc)... 2 1.1 Pagination :... 2 1.2 Marge :... 2 1.3 Police :... 2 1.4 Note de bas de page :... 2

Plus en détail

Office 2007 Simple et facile

Office 2007 Simple et facile Office 2007 Simple et facile Table des matières Section Word Chapitre 1 Lancement de Word Qu est-ce qu un traitement de textes?... 2 Lancement de Word?... 2 Exploration de la fenêtre Microsoft Word 2007...

Plus en détail

PhotoFiltre en bref DETAILS

PhotoFiltre en bref DETAILS Fiche 2 PhotoFiltre en bref PhotoFiltre est un logiciel de retouche d images très complet. PhotoFiltre est gratuit pour une utilisation privée, non commerciale ou éducative (incluant les organisations

Plus en détail

Powerpoint Atelier Cyber-Base Emploi Pays Beaujolais

Powerpoint Atelier Cyber-Base Emploi Pays Beaujolais Powerpoint Atelier Cyber-Base Emploi Pays Beaujolais Apprendre à utiliser le logiciel Powerpoint 2010, dans le but de réaliser une présentation auprès d un public. Les animateurs Cyber-base Emploi Pays

Plus en détail

SUPPORT FORMATION Publisher 2007 initiation.

SUPPORT FORMATION Publisher 2007 initiation. SUPPORT FORMATION Publisher 2007 initiation. Sommaire I. INTRODUCTION... 4 1. Avantage de Publisher... 4 2. Composition prédéfinies... 5 3. Composants indépendants et déplaçables... 5 4. Les atouts des

Plus en détail

Contenu Excel Module 1 Environnement d Excel Module 2 Premiers pas avec Excel. -i-

Contenu Excel Module 1 Environnement d Excel Module 2 Premiers pas avec Excel. -i- Contenu Excel 2010 Module 1 Environnement d Excel 2010 Environnement de travail Configuration avec Windows XP Paramètres régionaux de Windows XP Résolution de l écran Configuration avec Windows Vista Définir

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

15. GERER LES IMAGES D ARRIERE-PLAN

15. GERER LES IMAGES D ARRIERE-PLAN 52 15. GERER LES IMAGES D ARRIERE-PLAN Il y a deux méthodes pour insérer les graphiques d une page web : Ajout du graphique dans l arrière-plan d un DIV à l aide des CSS (exemple : une texture pour créer

Plus en détail

UTILISATION «PAGE BUILDER»

UTILISATION «PAGE BUILDER» 1/- AJOUTER DES IMAGES DANS LA BIBLIOTHÈQUE DES MÉDIAS. - Cliquer sur «Médias» puis sur l onglet «Bibliothèque». - Cliquer ensuite sur «Ajouter». 1 1 2 - Faire glisser les images à ajouter à l endroit

Plus en détail

2012 BOSS CORPORATION

2012 BOSS CORPORATION GT-100 Librarian Mode d emploi en ligne 2012 BOSS CORPORATION Tous droits réservés. Toute reproduction intégrale ou partielle de cette publication est interdite sous quelque forme que ce soit sans l autorisation

Plus en détail

Un exemple d'application

Un exemple d'application Cours 1 Tableur ; ex. : Excel Notions de base Un exemple d'application Données : Tableaux Classeurs, Feuilles, (Pages), Lignes / Colonnes, Cellules, Données Programme : Fonctions de base Généralités, Formules,

Plus en détail

Excel Mise en page. Modification des marges : Vous pouvez facilement choisir entre différentes propositions prédéfinies ou définir vos propres marges

Excel Mise en page. Modification des marges : Vous pouvez facilement choisir entre différentes propositions prédéfinies ou définir vos propres marges Un nombre élevé de lignes ou de colonnes d un tableau Excel peut entraîner l impression du tableau sur plusieurs pages. En modifiant la mise en page, il est tout à fait possible de réduire le nombre de

Plus en détail