Cookies acceptés.
bouton pour découvrir notre choix
bouton de redirection: haut
bouton de redirection: home
bouton de redirection: bas
bouton de redirection: explication des cookies
Création de sites web 3 D.   Webmaster, webdesign - Conseil.

Votre site web 3D, ... pour une autonomie.

Un espace francophone artisanal et pédagogique.
Logo de LigneWeb

la communication web
... JavaScript indispensable ... code utf-8 ... -  © design : LigneWeb

- Site expérimental en XHTML 1.0 et CSS 2.0 avec CSS 3.0 -


 •   Plan du site 
Avec des cours et des conseils.
  Notre Blog :  La ligne papyrus 
 MENU  -  Création site  - créer 1  - créer 2  - créer 3  - créer 4  - créer 5  - créer 6  - créer 7  - créer 8  - créer 9 
 Menu création site 5  - En-tête  - Eléments  - images  - style 



La Création d'un site web.
Cours 5 : l'en-tête.



 © LigneWeb  ... /création site: l'en-tête.
© design : LigneWeb
© : alain jean deligne - LigneWeb
Le logo de LigneWeb

Exemple d'en-tête.


Suivez-nous.








Remarque : ... en CSS2 et CSS3 ... :

pour cette page et non visible ... :
le fichier ...  ligne21.css  ... qui mélange du CSS 2 avec du CSS 3 ...
... et ceci grâce aux sélecteurs spécifiques ... expliqués au ...  Cours CSS 3 






Exercice pratique : réalisation concrète d'une page web tiré de ce site.

... avec la page nos offres ... simplifiée et sans le menu on/off ...

En-tête de ce site.


... prenons comme exemple partiel ...  l'en-tête de ce site  ...
... comme nous le savons, ... cet en-tête sera entièrement construit entre deux balises ...
... qui sont ... la balise entrante ... <div id="en-tete"> ...
... et la balise sortante ... </div> ...
... ceci a été vu au ...  cours 2 : .... qu'il faut connaître au préalable ...

... nous avons cet ...  exemple concret  ... dans la page ...  en-tête.html  ...

... c'est l'ancienne page ... «nos offres» ...

L'en-tête de la page : Nos offres.


... nous prenons la page ...  Nos offres  ... simplifiée ... sans le menu on/off ...
... ( il est créé par un script en JavaScript et est particulier ) ...
- nous en parlons dans la page ...  programmes 3  ... sur ce site -

Les éléments de l'entête :

... le premier élément est ... une introduction ... avec des phrases ...
... dont la première est dans un bloc de couleur ...

... le deuxième élément est une image, elle aussi dans un bloc de couleur ...

... le troisième élément est double ...
... une phrase centrée ... suivi par un lien hypertexte pour le plan ...

... il existe aussi une image de fond représenté par un personnage ...
... il est non défilant avec la page ... mais sera traité ... ultérieurement ...
... il se trouve en haut à gauche de l'en-tête, du menu et du pied de page ...
... il donne donc l'impression d'apparaître et de disparaître lors du défilement de la page ...

... nous avons cet ...  exemple concret  ... dans la page ...  en-tête.html  ...




Réalisation des différents éléments :

... la construction se fait dans l'ordre ... première phrase suivi de la deuxième ...
... et ainsi de suite ...  c'est important  ...

Les phrases d'entrée ...

... la première phrase se trouve dans un bloc ... comme ceci : ...


... le ... div presenta ... est  invisible : à nos yeux ...
... mais ... sert à placer le texte de présentation ... situé au-dessus de l'image ...
... le ... div table2b ... est le bloc de la première phrase ...
... le ... span ... permet un réglage personnel pour cette phrase ci ...
... sans changer les caractéristiques du bloc ... div table2b ... qui reste utilisable pour d'autres usages ...

... la deuxième phrase se trouve dans le bloc ... comme ceci : ...


... nous voyons que cette deuxième phrase se trouve en dessous ...
... elle est centée grâce au ... div presenta ...

... la troisième phrase se trouve dans le bloc ... comme ceci : ...


... nous suivons l'ordre de chacune des phrases en n'oubliant pas d'aller à la ligne ...



L'image ...

... l'image se trouve dans un bloc ... comme ceci : ...


... l'image vient naturellement dans son bloc visible ...



Des précisions ...

... les précisions se trouvent dans un bloc ... comme ceci : ...


... des annotations particulières de précision ...
... et une balise ...no-script ... qui fait apparaître le texte pour ceux qui n'ont pas JavaScript ...
... avec un bouton pour l'accès au plan ... avec un lien ...



Et le fichier extérieur CSS :

... nous ne donnons que les éléments propre à l'en-tête ...


... nous avons la feuille de style pour ... body ... et pour ... l'en-tête ...

... le fichier image ...  ligneweb22.jpg  ... doit aussi être disponible ...

... nous avons donc dans le dossier de notre site internet ...
① ... le fichier ... index.html ... qui est la première page ...
② ... d'autres fichiers ... pagex.html ... pour chacune des pages suivantes ...
... pagex étant leurs différents noms ...
③ ... le fichier ... style.css ... la feuille de style externe ...
④ ... le fichier ... ligneweb22.jpg ... le fichier image ...
... nous avons cet ...  exemple concret  ... dans la page ...  en-tête.html  ...


... design 3 D ...

...  fenêtre sur l'univers  ...             © design : LigneWeb - © Apple





 MENU  -  Création site  - créer 1  - créer 2  - créer 3  - créer 4  - créer 5  - créer 6  - créer 7  - créer 8  - créer 9 
  Essentiel :   - Accueil  - Offres  - Site photo  - Projet  - Historique  - Historique RSS  - Réalisations  - Création 
- Cours XHTML  - Cours CSS 2  - Création  site  - Cours HTML 5  - Cours CSS 3  - Cours jQuery 
- Programmes JS  - Liens - © - cookies  - Contact  - Plan du site 

Chaque enfant compte. Plan Belgique     Valid XHTML 1.0 Transitional     [Valid RSS]     CSS Valide !     Le logo de LigneWeb

... tout ne respecte pas le W3C ... site d'expérimentation ...

le titre du site web
©  Copyright :  "LigneWeb" (2008-2017) Tous droits réservés.  Légal  Design, Artisan web: mathalan 
 LigneWeb :   BE 0843 356 602. (2012-2017)   Conditions d'utilisation  Création: masterligne  • Qui sommes nous? 

Réinstaller le Bien en soi ... pour réinstaller le Bien sur terre ... et changer le monde.
© LigneWeb  Utilisation de cookies