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 1  - fichier html  - body  - entete  - fichier css ➽ ➽ ➽  page web pour s'exercer 



La Création d'un site web.
Cours 1 : les fichiers.



 © LigneWeb  ... /création site: body-entete.
© design : LigneWeb
© : alain jean deligne - LigneWeb

Le logo de LigneWeb

Fichiers XHTML et CSS 2.0




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 




Introduction : le fichier html.

... le fichier html est le fichier écrit en langage html, ou xhtml dont les balises sont :
... la balise d'entrée ... <html> ... et la balise de sortie ... </html> ...
... ( voir le  cours xhtml  )
... ces balises vont encadrer l'ensemble du fichier ... nommé pour le premier d'entre eux : ... index.html ...

... le navigateur sait qu'il doit travailler en html et traduit les balises, leurs attributs ...
... pour construire la page qui va apparaître sur mon écran et qui pourra aussi aller sur le net ...
... La balise unique DOCTYPE elle, précisera de quel html ou xhtml il s'agit ...

... à l'intérieur de la balise html, on va placer la balise ... body ...[entrante et sortante] ...
... à l'intérieur de celle-ci se place la balise ...en tête ...[entrante et sortante] ...
... le logo qui est une image sera introduit dans ce bloc ... par sa balise unique ...
... <img    /> ...
... avec son adresse par l'attribut ... src="______" ...

... comment ... placer cette image à la gauche à l'intérieur de la balise ... entete ... ?

c'est dans la feuille de style en CSS 2.0 ... que vont être donné les directives au navigateur ...
... cette feuille de style est un fichier ...  style.css  ... (style ou autre nom) ... mais …  extérieur  … au fichier index.html ...



Un schéma :


... commençons par réaliser le fichier html ...

... on va l'appelé ... test.html ... au lieu de index.html …

… dans le fichier ci-dessus, nous appelons le fichier … test.css … par la balise … link ...






Le fichier css.

... le style va se mettre dans un fichier spécial ....css ... (ici test.css) ...
... chaque balise porte un nom dont on se sert pour leur donner à chaqu'une d'elle un ensemble de valeurs ...
... ce fichier sera extérieur au fichier html, ce qui est demandé par le ...xhtml, …
… cela permettra de changer plus facilement le style ...

... construisons maintenant la page propre au style ...

... on va l'appelé ... style.css
... ATTENTION : les mesure permettent de réaliser la figure 1 en réel ...

... si nous voulons que le style s'applique à notre page ... test.html ... il faut l'appeler ...
... nous appelons test.html pour s'ouvrir dans le navigateur et lui va appeler le fichier style.css qui va agir sur chaque bloc nommé ...


... c'est une balise ... link ... placée dans le ... head ... qui est à mettre ...
... reprenons le fichier ... test.html ... et complétons-le ...

... le voila complété …

... les deux fichiers doivent être enregistré dans le même dossier ...
... qu'il soit sur votre ordinateur ... et il suffit d'ouvrir le fichier dans le navigateur ...
... ou placé sur un serveur ... un FAI ... ou un serveur indépendant ...
... et ce sera l'adresse de votre site qu'il faudra demander ...
...  les deux fichiers au même niveau  ...





Une page web pour s'exercer.

Nouvel outil

... pour avoir la possibilité de s'exercer dans le but d'apprendre ...
... il existe un outil intéressant qui montre en direct les effets de ce que l'on écrit ...
... cet outil est un site web  Js Bin  ...
... cet outil permet l'écriture correcte, toute erreur étant marquée en rouge ...
... au départ, il y a ouverture sur le HTML ... pour le html ...
... mais nous pouvons ouvrir le CSS ...
... nous montrons quelques exemples ...

Premier exemple :


la page web pour l'expérimentation

Deuxième exemple :


la page web pour l'expérimentation

... on peut s'enregistrer gratuitement, mais le modèle pro existe ...
... il y a même la possibilité d'y adjoindre des scripts en JavaScript ...
... c'est à utiliser comme outil d'entraînement, car pour réaliser un site, ce n'est pas suffisant ...

... commencer à taper les codes en fonction de vos connaissances et vous verrez l'outils fonctionner ...


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