Bordures

[footeuse]

Bonjour,

Je souhaiterais faires les bordures de mon menu un peu plus epaisse ou arrondis comment dois je faire

Merci pour votre aide

http://pagesperso-orange.fr/maternelle.alyscamps/

[GAUNCE]

Salut,
Tu augmentes la taille des bordures. Dans ton CSS, c'est à 1px, tu passes à 2 ou à 3. Pour l'arrondi faut attendre CSS3 et je ne sais si Kazé l'a inclus dans la new version de Kompozer?..
Voila ton CSS menu:
{
#menu dt {
cursor: pointer;
text-align: center;
font-weight: bold;
background: #ffff99;
border: 1px solid gray; C'est là
margin: 1px;

[chinon37]

Bonjour,

Pour augmenter les bordures de ton menu, il suffit que tu ouvres, dans KompoZer, l'éditeur css (F11).
puis, tu sélectionnes à gauche dans internal stylesheet (ou feuille interne) la régle #menu dt (comme l'a dit Gaunce)
> onglet bordure > tu choisis l'épaisseur du trait...
Tu peux également choisir un autre type de bordure dans les choix "style"
Pour les bordures arrondies, ce n'est pas possible en css2, sauf à utiliser une image de fond:
pour #menu td, tu choisis dans l'onglet fond de l'éditeur css:
> la couleur de fond identique à celle de ta page
> en image de fond, l'image que tu auras créée auparavant dans un logiciel tel qu'Inkscape aux dimensions de chaque élément de menu
> cette image sera centrée et non répétée
Exemple: sur ce site: http://www.chinonsntt.info/accueil.php, j'ai mis une image de fond pour les titres de menus. Tu peux le voir avec firefox en faisant un clic droit sur "le club" ou "sportif" > afficher l'image de fond.

HS: sur ta page photos, les miniatures sont beaucoup trop lourdes: il faudrait que tu compresses les photos pour qu'elles ne soient pas redimensionnées par le navigateur. Il est préférable que tu ais 2 photos à chaque fois: la miniature (en 120 x 90) et la photo en grand format d'affichage (750 x 500). Il ne sert à rien de garder le format d'origine. En effet:
- les images et donc les pages seront longues à s'afficher
- les images redimensionnées par le navigateur sont détériorées et de moindre qualité
En fait, dés que, dans les propriétés de l'image (dans KpZ), tu coches "taille personnalisée" et que tu définis de nouvelles tailles, l'image sera redimensionnée par le navigateur.

[footeuse]

Ok merci beaucoup pour vote aide mais comment compresser les photos pour qu'elle soit moins lourdes je pensais qu'en les reduisant elle serait moins lourde je debute en site avec kompozer c'est pas evident

Merci pour votre aide

[Fabrice.Tres.Net]

Ne pas confondre compression et redimensionner des images.

La première méthode consiste à réduire la qualité d'affichage.

La seconde consiste à faire une image de "la même qualtité" en réduisant la taille d'affichage, si 2 fois plus petite en dimension donc 4 fois moins de surface soit 4 fois moins d'éléments à afficher!

Cela se fait avec tout logiciel de traitement d'images, choisir Redimensionner (resize).

[footeuse]

Il faut que je les redimensionne avec mon logiciel photo ou je peux le faire avec Kompozer

[footeuse]

Une autre question comment faire pour que les photos soit bien centrer sur ma page j'ai essayé de faire comme pour un texte qu'on centre dans une page mais ca ne march pas trop bien

Merci

[chinon37]

pour tes photos, tu peux utiliser conversionMagick (http://www.framasoft.net/article4647.html) qui te permet de travailler par lots. Tu pourras ainsi traiter plusieurs photos en une seule fois.
Non, KpZ ne permet pas le redimensionnement ou la compression.
Lorsque tu redimensionnes avec KpZ, par la fenêtre "propriété d'image", tu gardes la dimension et le poids d'origine, ce qui prend de la place sur le serveur, met plus de temps à s'afficher et consomme plus d'énergie...
* irfanview n'est pas mal non plus pour ce genre de tâche, mais je ne crois pas qu'il soit libre, par contre il est gratuit pour les enseignants

Pour le centrage des photos, il faudrait que tu donnes un exemple précis de ce que tu cherches à faire

[footeuse]

J'aimerais que mes photos soit centrer sur la page là je le fais avec la barre d'espacement et ce n'est pas evident enfin si celà est possible

Merci

[chinon37]

Quelque chose comme ça?

Code : Tout sélectionner

<!DOCTYPE html PUBLIC "-//W3C//DTD HTML 4.01//EN" "http://www.w3.org/TR/html4/strict.dtd">
<html><head><meta content="text/html; charset=ISO-8859-1" http-equiv="content-type"><title>essai</title><style type="text/css">
body {
  text-align: center;
  background-color: #ffffcc;
}
li {
  padding: 40px;
  list-style-type: none;
  display: inline;
}
h1 {
  color: #000099;
}
ul {
  width: 500px;
  margin-right: auto;
  margin-left: auto;
}

</style></head><body>
<h1><a href="http://pagesperso-orange.fr/maternelle.alyscamps/Accueil.html"><img style="border: 0px solid ; width: 75px; height: 42px;" alt="retour" src="http://pagesperso-orange.fr/maternelle.alyscamps/RETOUR.gif"></a>LES PHOTOS</h1>
<h4>Cliquez sur une photo pour la voir en grand format</h4>
<ul>
  <li><a href="http://pagesperso-orange.fr/maternelle.alyscamps/salle%20d%27accueil.html"><img style="border: 0px solid ; width: 120px; height: 90px;" alt="accueil" src="http://pagesperso-orange.fr/maternelle.alyscamps/HPIM1452.jpg" vspace="20"></a></li>
  <li><a href="http://pagesperso-orange.fr/maternelle.alyscamps/vestiaire%20petits.html"><img style="border: 0px solid ; width: 120px; height: 90px;" alt="vestiaire des petits" src="http://pagesperso-orange.fr/maternelle.alyscamps/HPIM1459.jpg" vspace="20"></a></li>
  <li><span style="font-family: Arial; font-weight: bold;"><a href="http://pagesperso-orange.fr/maternelle.alyscamps/COUR1.html"><img style="border: 0px solid ; width: 120px; height: 87px;" alt="la cour" src="http://pagesperso-orange.fr/maternelle.alyscamps/HPIM1453.jpg" vspace="20"></a></span></li>
  <li><a href="http://pagesperso-orange.fr/maternelle.alyscamps/vestiaires%20des%20Moyens%20et%20des%20Grands.html"><img style="border: 0px solid ; width: 120px; height: 90px;" alt="vestiaire moyens grands" src="http://pagesperso-orange.fr/maternelle.alyscamps/HPIM1460.jpg" vspace="20"></a></li>

  <li><span style="font-family: Arial; font-weight: bold;"><a href="http://pagesperso-orange.fr/maternelle.alyscamps/Les%20sanitaires.html"><img style="border: 0px solid ; width: 120px; height: 90px;" alt="les sanitaires" src="http://pagesperso-orange.fr/maternelle.alyscamps/HPIM1451-WEB.jpg" vspace="20"></a></span></li>
</ul>
<br>
</body></html>

J'ai fait cela vite fait...
Avec tout le respect que je te dois, le code de ta page est catastrophique et ne peut faire qu'un affichage totalement aléatoire...
Mon code est loin d'être parfait car fait en 10 minutes, mais tu peux comparer les 2 et tu verras qu'en faisant simple, on peut faire mieux que ce que tu as fait (qui est très compliqué)
je te conseille de reprendre tranquillement et pas à pas un tuto sur KompoZer pour vraiment comprendre les bases de la mise en page
(voir par exemple ce tuto: http://josar.free.fr/tutoKompozer/miseEnFormePlan.html ou celui-ci: http://info.sio2.be/kpz/3/index.php)

[footeuse]

Oui je sais que je suis pas forte mais comme je l'ai dit je debute c'est pour cela que je demande conseil

Merci

[chinon37]

Ce n'était pas un jugement que je portais, juste un constat
On a tous commencé comme ça, et j'en ai fait partie
Mais avec les tutos ci-dessus, tu verras que tu progresseras très vite... et on sera toujours là pour les coups de main

[footeuse]

je vous remercie c'est sympa de votre part et je vais ecouter les conseils que chacun me donne ici mais c'est vrais que je ne suis pas très doué

Bonne soirée et merci encore

[footeuse]

Bonjour

J'aimerais savoir comment dois je faire pour aligner trois textes les uns a coté des autres faut t'il faire avec un tableau ?
Merci pour voter aide

[GAUNCE]

Tu devrais suivre le conseil de Chinon, à savoir lire les deux tutos qu'il te propose:
http://josar.free.fr/tutoKompozer/miseEnFormePlan.html ou celui-ci: http://info.sio2.be/kpz/3/index.php)
La réponse à ta question est la base même de la mise en page, deuxième tuto , celui du buveur de bière!