Bonjour,
Comment créer une page à trois cadres verticaux. Je n'ai pas trouvé de
model correspondant dans FP. Je veux créer deux cadres verticaux, un à
gauche et un autre à droite et entre les deux, ma page web principale.
Actuellement une grosse barre de liens occupe le haut de ma page et prend
trop d'espace écran.
Bonjour,
Comment créer une page à trois cadres verticaux. Je n'ai pas trouvé de
model correspondant dans FP. Je veux créer deux cadres verticaux, un à
gauche et un autre à droite et entre les deux, ma page web principale.
Actuellement une grosse barre de liens occupe le haut de ma page et prend
trop d'espace écran.
Bonjour,
Comment créer une page à trois cadres verticaux. Je n'ai pas trouvé de
model correspondant dans FP. Je veux créer deux cadres verticaux, un à
gauche et un autre à droite et entre les deux, ma page web principale.
Actuellement une grosse barre de liens occupe le haut de ma page et prend
trop d'espace écran.
Bonjour,
Dans les modèles de cadre, choisissez celui Division verticale. Cliquez
dans l'un des cadres et choisissez le menu Cadres - Fractionner le cadre -
Fractionner en colonnes. Ajustez ensuite la largeur des cadres avec la
souris.
Les pages appelées dans des cadres sont parfois affichées seules (par
exemple quand elles sont trouvées en passant par un moteur de recherche).
Il serait bon d'ajouter un lien hypertexte pointant vers la page d'accueil
au début ou à la fin de chacunes des pages du site, de façon à permettre
aux visiteurs de naviguer quand même. Et n'oubliez pas d'utiliser l'onglet
"Pas de cadres" au bas de la page de cadres, pour inscrire une alternative
destinée aux visiteurs qui ne peuvent utiliser les cadres.
Au revoir,
Louise
"Kasfipasherov" a écrit dans le message de news:Bonjour,
Comment créer une page à trois cadres verticaux. Je n'ai pas trouvé de
model correspondant dans FP. Je veux créer deux cadres verticaux, un à
gauche et un autre à droite et entre les deux, ma page web principale.
Actuellement une grosse barre de liens occupe le haut de ma page et prend
trop d'espace écran.
Bonjour,
Dans les modèles de cadre, choisissez celui Division verticale. Cliquez
dans l'un des cadres et choisissez le menu Cadres - Fractionner le cadre -
Fractionner en colonnes. Ajustez ensuite la largeur des cadres avec la
souris.
Les pages appelées dans des cadres sont parfois affichées seules (par
exemple quand elles sont trouvées en passant par un moteur de recherche).
Il serait bon d'ajouter un lien hypertexte pointant vers la page d'accueil
au début ou à la fin de chacunes des pages du site, de façon à permettre
aux visiteurs de naviguer quand même. Et n'oubliez pas d'utiliser l'onglet
"Pas de cadres" au bas de la page de cadres, pour inscrire une alternative
destinée aux visiteurs qui ne peuvent utiliser les cadres.
Au revoir,
Louise
"Kasfipasherov" <Nobody@nospam.com> a écrit dans le message de news:
ekh1UGjpJHA.1288@TK2MSFTNGP02.phx.gbl...
Bonjour,
Comment créer une page à trois cadres verticaux. Je n'ai pas trouvé de
model correspondant dans FP. Je veux créer deux cadres verticaux, un à
gauche et un autre à droite et entre les deux, ma page web principale.
Actuellement une grosse barre de liens occupe le haut de ma page et prend
trop d'espace écran.
Bonjour,
Dans les modèles de cadre, choisissez celui Division verticale. Cliquez
dans l'un des cadres et choisissez le menu Cadres - Fractionner le cadre -
Fractionner en colonnes. Ajustez ensuite la largeur des cadres avec la
souris.
Les pages appelées dans des cadres sont parfois affichées seules (par
exemple quand elles sont trouvées en passant par un moteur de recherche).
Il serait bon d'ajouter un lien hypertexte pointant vers la page d'accueil
au début ou à la fin de chacunes des pages du site, de façon à permettre
aux visiteurs de naviguer quand même. Et n'oubliez pas d'utiliser l'onglet
"Pas de cadres" au bas de la page de cadres, pour inscrire une alternative
destinée aux visiteurs qui ne peuvent utiliser les cadres.
Au revoir,
Louise
"Kasfipasherov" a écrit dans le message de news:Bonjour,
Comment créer une page à trois cadres verticaux. Je n'ai pas trouvé de
model correspondant dans FP. Je veux créer deux cadres verticaux, un à
gauche et un autre à droite et entre les deux, ma page web principale.
Actuellement une grosse barre de liens occupe le haut de ma page et prend
trop d'espace écran.
Bonjour,
D'autre part, que dois-je faire dans l'onglet "pas de cadre"? Je clique
dessus, il y a effectivement un texte tout en haut sur une page blanche?
Et après, que se passe-t-il?
Bonjour,
D'autre part, que dois-je faire dans l'onglet "pas de cadre"? Je clique
dessus, il y a effectivement un texte tout en haut sur une page blanche?
Et après, que se passe-t-il?
Bonjour,
D'autre part, que dois-je faire dans l'onglet "pas de cadre"? Je clique
dessus, il y a effectivement un texte tout en haut sur une page blanche?
Et après, que se passe-t-il?
Bonjour,
Pour les problèmes d'accessibilité causés par les cadres, la vraie
solution serait de se passer des cadres et de les remplacer par des
balises <div>. Ce sont des divisions, des blocs, pour encadrer une partie
des paragraphes. On peut les positionner de façon à simuler des colonnes.
Et lorsqu'un navigateur ne comprend pas cette commande <div>, cela ne
cause pas de problème, les divisions sont alors affichées l'une à la suite
de l'autre. Le contenu demeure accessible.
Vous pourriez faire un essai en recopiant le texte plus bas dans le code
d'une nouvelle page vide, en remplacement de celui actuel. Cette page
contient quatre divisions, une pour chaque colonne et une autre nommée
"container" qui encadre les trois premières:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="ltr" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="fr" http-equiv="Content-Language" />
<title>Exemple de page à trois colonnes</title>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<link href="style3.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="container">
<div id="left_col">
<p>colonne à gauche</p>
</div>
<div id="right_col">
<p>colonne à droite</p>
</div>
<div id="page_content">
<p>colonne centrale</p>
</div>
</div>
</body>
</html>
-----------------------------
Dans le code de la page, remarquez la commande link dans la section head.
Elle réfère à une feuille de style où la position des divisions est
définie.
Pour créer une feuille de style (un fichier texte avec l'extension .css),
vous pouvez utiliser le Bloc-notes ou, dans FrontPage 2003, le menu
Fichier, Nouveau, Autres modèles de pages, onglet Feuilles de style,
Feuille de style normal. Puis enregistrez la page sous le nom de
"style3.css".
Placez-y les commandes pour positionner les blocs comme dans l'exemple
suivant. Le bloc qui contient les autres, #container, peut s'étirer pour
occuper tout l'écran, mais ici sa largeur minimale est définie à 600
pixels. Ceux à gauche et à droite ont une largeur fixe de 200 pixels.
Tandis que le bloc central a des marges de 200 pixels, de façon à laisser
de la place aux autres divisions.
body {
margin: 0;
padding: 0;
}
#container {
min-width: 600px;
}
#left_col {
float: left;
width: 200px;
}
#right_col {
float: right;
width: 200px;
}
#page_content {
margin-right: 200px;
margin-left: 200px;
}
-----------------------------
Ensuite, vous pourrez changer le contenu des colonnes, y placer vos textes
et vérifier le résultat dans plusieurs navigateurs.
C'est une alternative qui remplace avantageusement les cadres et les
tableaux de disposition.
Bonne chance dans vos travaux,
Louise
Bonjour,
Pour les problèmes d'accessibilité causés par les cadres, la vraie
solution serait de se passer des cadres et de les remplacer par des
balises <div>. Ce sont des divisions, des blocs, pour encadrer une partie
des paragraphes. On peut les positionner de façon à simuler des colonnes.
Et lorsqu'un navigateur ne comprend pas cette commande <div>, cela ne
cause pas de problème, les divisions sont alors affichées l'une à la suite
de l'autre. Le contenu demeure accessible.
Vous pourriez faire un essai en recopiant le texte plus bas dans le code
d'une nouvelle page vide, en remplacement de celui actuel. Cette page
contient quatre divisions, une pour chaque colonne et une autre nommée
"container" qui encadre les trois premières:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="ltr" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="fr" http-equiv="Content-Language" />
<title>Exemple de page à trois colonnes</title>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<link href="style3.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="container">
<div id="left_col">
<p>colonne à gauche</p>
</div>
<div id="right_col">
<p>colonne à droite</p>
</div>
<div id="page_content">
<p>colonne centrale</p>
</div>
</div>
</body>
</html>
-----------------------------
Dans le code de la page, remarquez la commande link dans la section head.
Elle réfère à une feuille de style où la position des divisions est
définie.
Pour créer une feuille de style (un fichier texte avec l'extension .css),
vous pouvez utiliser le Bloc-notes ou, dans FrontPage 2003, le menu
Fichier, Nouveau, Autres modèles de pages, onglet Feuilles de style,
Feuille de style normal. Puis enregistrez la page sous le nom de
"style3.css".
Placez-y les commandes pour positionner les blocs comme dans l'exemple
suivant. Le bloc qui contient les autres, #container, peut s'étirer pour
occuper tout l'écran, mais ici sa largeur minimale est définie à 600
pixels. Ceux à gauche et à droite ont une largeur fixe de 200 pixels.
Tandis que le bloc central a des marges de 200 pixels, de façon à laisser
de la place aux autres divisions.
body {
margin: 0;
padding: 0;
}
#container {
min-width: 600px;
}
#left_col {
float: left;
width: 200px;
}
#right_col {
float: right;
width: 200px;
}
#page_content {
margin-right: 200px;
margin-left: 200px;
}
-----------------------------
Ensuite, vous pourrez changer le contenu des colonnes, y placer vos textes
et vérifier le résultat dans plusieurs navigateurs.
C'est une alternative qui remplace avantageusement les cadres et les
tableaux de disposition.
Bonne chance dans vos travaux,
Louise
Bonjour,
Pour les problèmes d'accessibilité causés par les cadres, la vraie
solution serait de se passer des cadres et de les remplacer par des
balises <div>. Ce sont des divisions, des blocs, pour encadrer une partie
des paragraphes. On peut les positionner de façon à simuler des colonnes.
Et lorsqu'un navigateur ne comprend pas cette commande <div>, cela ne
cause pas de problème, les divisions sont alors affichées l'une à la suite
de l'autre. Le contenu demeure accessible.
Vous pourriez faire un essai en recopiant le texte plus bas dans le code
d'une nouvelle page vide, en remplacement de celui actuel. Cette page
contient quatre divisions, une pour chaque colonne et une autre nommée
"container" qui encadre les trois premières:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN"
"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html dir="ltr" xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta content="fr" http-equiv="Content-Language" />
<title>Exemple de page à trois colonnes</title>
<meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
<link href="style3.css" rel="stylesheet" type="text/css" />
</head>
<body>
<div id="container">
<div id="left_col">
<p>colonne à gauche</p>
</div>
<div id="right_col">
<p>colonne à droite</p>
</div>
<div id="page_content">
<p>colonne centrale</p>
</div>
</div>
</body>
</html>
-----------------------------
Dans le code de la page, remarquez la commande link dans la section head.
Elle réfère à une feuille de style où la position des divisions est
définie.
Pour créer une feuille de style (un fichier texte avec l'extension .css),
vous pouvez utiliser le Bloc-notes ou, dans FrontPage 2003, le menu
Fichier, Nouveau, Autres modèles de pages, onglet Feuilles de style,
Feuille de style normal. Puis enregistrez la page sous le nom de
"style3.css".
Placez-y les commandes pour positionner les blocs comme dans l'exemple
suivant. Le bloc qui contient les autres, #container, peut s'étirer pour
occuper tout l'écran, mais ici sa largeur minimale est définie à 600
pixels. Ceux à gauche et à droite ont une largeur fixe de 200 pixels.
Tandis que le bloc central a des marges de 200 pixels, de façon à laisser
de la place aux autres divisions.
body {
margin: 0;
padding: 0;
}
#container {
min-width: 600px;
}
#left_col {
float: left;
width: 200px;
}
#right_col {
float: right;
width: 200px;
}
#page_content {
margin-right: 200px;
margin-left: 200px;
}
-----------------------------
Ensuite, vous pourrez changer le contenu des colonnes, y placer vos textes
et vérifier le résultat dans plusieurs navigateurs.
C'est une alternative qui remplace avantageusement les cadres et les
tableaux de disposition.
Bonne chance dans vos travaux,
Louise
Bonjour,
J'ai recopié en passant par le bloc-note tel quel le code dans une page
vierge (onglet html) et les colonnes apparaissent les unes au dessous des
autres au lieu de les avoir les unes à côté des autres.. Sinon, oui cette
possibilité semble adéquate car on peut j'imagine insérer des tableaux
dans ces colonnes?
A suivre...
Bonjour,
J'ai recopié en passant par le bloc-note tel quel le code dans une page
vierge (onglet html) et les colonnes apparaissent les unes au dessous des
autres au lieu de les avoir les unes à côté des autres.. Sinon, oui cette
possibilité semble adéquate car on peut j'imagine insérer des tableaux
dans ces colonnes?
A suivre...
Bonjour,
J'ai recopié en passant par le bloc-note tel quel le code dans une page
vierge (onglet html) et les colonnes apparaissent les unes au dessous des
autres au lieu de les avoir les unes à côté des autres.. Sinon, oui cette
possibilité semble adéquate car on peut j'imagine insérer des tableaux
dans ces colonnes?
A suivre...
Bonjour,
Si les colonnes paraissent l'une sous l'autre, c'est que la feuille de
style n'est pas là ou qu'elle n'est pas reconnue (c'est-à-dire le fichier
style3.css).
Cette commande est-elle en place dans la section head du code:
<link href="style3.css" rel="stylesheet" type="text/css" />
Avez-vous créé un deuxième fichier pour la feuille de style et l'avez-vous
enregistré sous le nom de style3.css?
Le fichier style3.css est-il placé dans le même dossier que la page de
test?
En rappel, voici le contenu attendu pour ce fichier style3.css:
body {
margin: 0;
padding: 0;
}
#container {
min-width: 600px;
}
#left_col {
float: left;
width: 200px;
}
#right_col {
float: right;
width: 200px;
}
#page_content {
margin-right: 200px;
margin-left: 200px;
}
Si cela ne fonctionne pas, pouvez-vous publier votre page de test quelque
part, avec la feuille de style ? Je verrai peut-être le problème.
En réponse à votre question, oui, on peut insérer des tableaux à
l'intérieur d'une balise <div>.
Les points à faire attention pour l'accessibilité:
- ne pas imbriquer un tableau à l'intérieur d'un autre;
- ne pas fusionner de cellules.
Au revoir,
Louise
"Kasfipasherov" a écrit dans le message de news:
%23yeHFE%Bonjour,
J'ai recopié en passant par le bloc-note tel quel le code dans une page
vierge (onglet html) et les colonnes apparaissent les unes au dessous des
autres au lieu de les avoir les unes à côté des autres.. Sinon, oui cette
possibilité semble adéquate car on peut j'imagine insérer des tableaux
dans ces colonnes?
A suivre...
Bonjour,
Si les colonnes paraissent l'une sous l'autre, c'est que la feuille de
style n'est pas là ou qu'elle n'est pas reconnue (c'est-à-dire le fichier
style3.css).
Cette commande est-elle en place dans la section head du code:
<link href="style3.css" rel="stylesheet" type="text/css" />
Avez-vous créé un deuxième fichier pour la feuille de style et l'avez-vous
enregistré sous le nom de style3.css?
Le fichier style3.css est-il placé dans le même dossier que la page de
test?
En rappel, voici le contenu attendu pour ce fichier style3.css:
body {
margin: 0;
padding: 0;
}
#container {
min-width: 600px;
}
#left_col {
float: left;
width: 200px;
}
#right_col {
float: right;
width: 200px;
}
#page_content {
margin-right: 200px;
margin-left: 200px;
}
Si cela ne fonctionne pas, pouvez-vous publier votre page de test quelque
part, avec la feuille de style ? Je verrai peut-être le problème.
En réponse à votre question, oui, on peut insérer des tableaux à
l'intérieur d'une balise <div>.
Les points à faire attention pour l'accessibilité:
- ne pas imbriquer un tableau à l'intérieur d'un autre;
- ne pas fusionner de cellules.
Au revoir,
Louise
"Kasfipasherov" <Nobody@nospam.com> a écrit dans le message de news:
%23yeHFE%23pJHA.5900@TK2MSFTNGP04.phx.gbl...
Bonjour,
J'ai recopié en passant par le bloc-note tel quel le code dans une page
vierge (onglet html) et les colonnes apparaissent les unes au dessous des
autres au lieu de les avoir les unes à côté des autres.. Sinon, oui cette
possibilité semble adéquate car on peut j'imagine insérer des tableaux
dans ces colonnes?
A suivre...
Bonjour,
Si les colonnes paraissent l'une sous l'autre, c'est que la feuille de
style n'est pas là ou qu'elle n'est pas reconnue (c'est-à-dire le fichier
style3.css).
Cette commande est-elle en place dans la section head du code:
<link href="style3.css" rel="stylesheet" type="text/css" />
Avez-vous créé un deuxième fichier pour la feuille de style et l'avez-vous
enregistré sous le nom de style3.css?
Le fichier style3.css est-il placé dans le même dossier que la page de
test?
En rappel, voici le contenu attendu pour ce fichier style3.css:
body {
margin: 0;
padding: 0;
}
#container {
min-width: 600px;
}
#left_col {
float: left;
width: 200px;
}
#right_col {
float: right;
width: 200px;
}
#page_content {
margin-right: 200px;
margin-left: 200px;
}
Si cela ne fonctionne pas, pouvez-vous publier votre page de test quelque
part, avec la feuille de style ? Je verrai peut-être le problème.
En réponse à votre question, oui, on peut insérer des tableaux à
l'intérieur d'une balise <div>.
Les points à faire attention pour l'accessibilité:
- ne pas imbriquer un tableau à l'intérieur d'un autre;
- ne pas fusionner de cellules.
Au revoir,
Louise
"Kasfipasherov" a écrit dans le message de news:
%23yeHFE%Bonjour,
J'ai recopié en passant par le bloc-note tel quel le code dans une page
vierge (onglet html) et les colonnes apparaissent les unes au dessous des
autres au lieu de les avoir les unes à côté des autres.. Sinon, oui cette
possibilité semble adéquate car on peut j'imagine insérer des tableaux
dans ces colonnes?
A suivre...