Forum |  HardWare.fr | News | Articles | PC | S'identifier | S'inscrire | Shop Recherche
1363 connectés 

  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [CSS] a:hover - menu - overflow - imbrication - div - dl - dd - dt

 


 Mot :   Pseudo :  
 
 Page :   1  2  3  4
Page Précédente
Auteur Sujet :

[CSS] a:hover - menu - overflow - imbrication - div - dl - dd - dt

n°1222795
DrWatson
_@''
Posté le 14-10-2005 à 10:25:25  profilanswer
 

Merci à ces 3 forumeurs pour leurs explications et leur grande générosité à aider : gatsusat, FlorentG, mechkurt (et merci aux quelques autres qui sont intevenus de ci de là)
 
Ce topic parle essentiellement de CSS
 
Je vais tenter de retracer ici les grands axes de leurs explications :
 

  • Définir une second type de lien a et a:hover : page 1
  • Mise en place d'un menu CSS (avec un peu de JS tout de même) : page 1 et page 2
  • La notion de dimension em pour garder des tailles relatives (à la place de px où pt dans certains cas) : page 2
  • L'overflow (intégrer du texte dans une boite avec ascenseur dans une page Web) à la place des frame/iframe obsolètes : page 2
  • Entête et Pied de page dans une seule page php (pour simplifier la mise en page et les mises à jour) : page 2
  • Arrêter d'utiliser systématiquement des <table> pour les mises en pages, mixer du div et des dl, dd, dt :  page 3
  • Différence entres classes et id (bloc) - Imbrication de div : page 3


A suivre ...
 
_____________________
Sujet initial de mon topic
_____________________
 
Bonjour à tous,
 
J'aimerais avoir deux types de lien a et a hover dans la même feuille et les appeler comme bon me semble selon les liens de ma page, est ce possible ?
 
est qu'un truc du genre
 
   a{font-family:Verdana;font-size:10pt;text-decoration:none;background-color:#D1E9F7;color:#000000;}
   a:hover{font-family:Verdana;font-size:10pt;text-decoration:none;background-color:#FAF5FA;color:#000000;}
 
   a.2{font-family:Verdana;font-size:10pt;text-decoration:none;background-color:#D1E9F7;color:#000000;}
   a.2:hover{font-family:Verdana;font-size:10pt;text-decoration:none;background-color:#FAF5FA;color:#000000;}
 
 
fonctionnerait :??:
 
'rki :jap:


Message édité par DrWatson le 25-10-2005 à 15:28:31

---------------
.:: Feed-Back  ::. Choisis un travail que tu aimes, et tu n'auras pas à travailler un seul jour de ta vie.
mood
Publicité
Posté le 14-10-2005 à 10:25:25  profilanswer
 

n°1222806
gatsusat
Posté le 14-10-2005 à 10:29:18  profilanswer
 

EN CSS à partir du moment ou tu as defini des propriétés sur un élément, ca ne sert à rien de les réécrires. puisque le A:hover aura par defaut les propriétés du a
 
idem pour le a.2 qui aura deja par defaut les propriétés du A
 

Code :
  1. a{
  2. font-family:Verdana;
  3. font-size:10pt;
  4. text-decoration:none;
  5. background-color:#D1E9F7;
  6. color:#000000;
  7. }
  8. a:hover{
  9. background-color:#FAF5FA;
  10. }
  11. a.lien2{background:red}
  12. a.lien2:hover{background:blue}


et ensuite dans tes liens tu as juste à faire ceci :  
<a href="" class="lien2">
les noms de classe ne commencent pas par des chiffres. et eviter les noms super court comme tu l'a fait


Message édité par gatsusat le 14-10-2005 à 10:29:35

---------------
Les CSS c'est bon mangez-en
n°1222832
DrWatson
_@''
Posté le 14-10-2005 à 10:44:27  profilanswer
 

Merci bien !
 
Oui pour les noms, là c'était pour l'exemple, je met toujours des mots pour comprendre de quoi il s'agit (si tu voulais dire ça par "pas de nom court" )
 
merci encore :)


---------------
.:: Feed-Back  ::. Choisis un travail que tu aimes, et tu n'auras pas à travailler un seul jour de ta vie.
n°1222844
DrWatson
_@''
Posté le 14-10-2005 à 10:51:35  profilanswer
 

et je vire mes déclarations en doublon, c'est bon à savoir :)


---------------
.:: Feed-Back  ::. Choisis un travail que tu aimes, et tu n'auras pas à travailler un seul jour de ta vie.
n°1222862
gatsusat
Posté le 14-10-2005 à 10:55:36  profilanswer
 

ben nom court : 2
nom long : b2
 
lol
koi ke il vaut mieux etre un peu plus explicite :
un truc important ca sera : class="important"
et non pas class="rouge", si tu avais l'intention de le mettre en rouge


---------------
Les CSS c'est bon mangez-en
n°1222895
DrWatson
_@''
Posté le 14-10-2005 à 11:11:06  profilanswer
 

lol
 
yes :)
 
 
j'ai un gros pépin parce que mes liens sont dans du javascript
 
 
<font class='Menu'>[</font><a href="javascript:void(0);" onclick="return overlib('<li><a href=\'accueil.php\' class='lien2'> Page de démarrage</a></li><li><a href=\'news.php\' class='lien2'> Voir toutes les news</a></li><li><a href=\'identification.htm\' class='lien2'> Identification</a></li>', STICKY, CAPTION, 'ACCUEIL', CENTER, TIMEOUT, 3000);" onmouseout="nd();"><font class='Menu'>ACCUEIL</font></a><font class='Menu'>]</font>
 
du coup mon js ne marche plus :/
 
http://isislafurette.free.fr avant quant on cliquait sur un élément du menu, un petit sous menu s'ouvrait


---------------
.:: Feed-Back  ::. Choisis un travail que tu aimes, et tu n'auras pas à travailler un seul jour de ta vie.
n°1222907
gatsusat
Posté le 14-10-2005 à 11:15:40  profilanswer
 

mais c'est koua ce caca ?
c'est koi tes font class="menu" ?
font ca existe plus
tu style via A boudiou
 
et puis un menu c'est pas comme ca, c'est plus comme ca :
http://css.alsacreations.com/Const [...] us-en-CSS/
http://css.alsacreations.com/Galeries-de-menus-en-CSS


---------------
Les CSS c'est bon mangez-en
n°1222977
DrWatson
_@''
Posté le 14-10-2005 à 11:48:38  profilanswer
 

ben j'avais besoin de changer la taille de la police pour mon menu et ça marche pourtant <font class='menu'>
 
pourquoi ça n'existe pas  
 
avant j'avais des images et des rolleover mais ça me prenait la tête quand je voulais changer les couleurs de ma feuille de style, alors je suis passé au texte, mais avant de me "compliquer" le menu, je commençais par du symple


---------------
.:: Feed-Back  ::. Choisis un travail que tu aimes, et tu n'auras pas à travailler un seul jour de ta vie.
n°1222982
DrWatson
_@''
Posté le 14-10-2005 à 11:49:45  profilanswer
 

j'ai remis comme avant, regarde ce que me donne le javascript


---------------
.:: Feed-Back  ::. Choisis un travail que tu aimes, et tu n'auras pas à travailler un seul jour de ta vie.
n°1223008
gatsusat
Posté le 14-10-2005 à 12:00:08  profilanswer
 

tu lis et tu regardes les liens que je t'ai donné, ou sinon je me fache.
 


---------------
Les CSS c'est bon mangez-en
mood
Publicité
Posté le 14-10-2005 à 12:00:08  profilanswer
 

n°1223030
DrWatson
_@''
Posté le 14-10-2005 à 12:21:59  profilanswer
 

[:xx_xx]  
 
je vais lire mais je ne jette pas mon java script car j'ai mis une plombe à le mettre en place :o


---------------
.:: Feed-Back  ::. Choisis un travail que tu aimes, et tu n'auras pas à travailler un seul jour de ta vie.
n°1223031
DrWatson
_@''
Posté le 14-10-2005 à 12:22:23  profilanswer
 

de toute façon c'est bookmarqué car j'approfondi de jour en jour les css


---------------
.:: Feed-Back  ::. Choisis un travail que tu aimes, et tu n'auras pas à travailler un seul jour de ta vie.
n°1223071
gatsusat
Posté le 14-10-2005 à 13:11:13  profilanswer
 

ton javascript il est tout pourri et même pas accessible, une merde sans nom koi


---------------
Les CSS c'est bon mangez-en
n°1223287
DrWatson
_@''
Posté le 14-10-2005 à 15:59:29  profilanswer
 

stoi pourri :o t'insulte un peu trop rapidement, serais tu dieu tout puissant ?  [:kryten]  , il est accessible ici => http://isislafurette.free.fr/scripts/overlib.js et tape overlib dans google, sa bibliothèque de fonctions est super bien foutue


Message édité par DrWatson le 14-10-2005 à 16:00:23
n°1223330
mechkurt
Posté le 14-10-2005 à 16:21:25  profilanswer
 

accessible ca vaut pas dire que les sources sont caché, de tout facon cacher des sources javascript :heink: ...
ca veut dire que si l'utilisateur a le javascript desactivé (comme environ 10% des gens) il ne pourra pas naviguer sur ton site...

Message cité 1 fois
Message édité par mechkurt le 14-10-2005 à 16:22:04

---------------
D3
n°1223338
gatsusat
Posté le 14-10-2005 à 16:26:00  profilanswer
 

jvais checker ton menu pour  voir de plus pres, je croyais ke CT un menu entierement généré par JS


---------------
Les CSS c'est bon mangez-en
n°1223342
gatsusat
Posté le 14-10-2005 à 16:28:06  profilanswer
 

ton menu est bien innacessible, en desactivant le JS, on a plus accès à koi ke ce soit. LE JS de nos jours
et non pas comme 95% des gens font, est intrusif.
 
en gros le JS attaque le code HTML et lui rajoute des fonctionnalités.


---------------
Les CSS c'est bon mangez-en
n°1223411
Roane
Pingouino's fan
Posté le 14-10-2005 à 17:01:04  profilanswer
 

L'overlib ? Loooooool :D
 
Edit : FlorentG ! FlorentG ! Y a quelqu'un pour toi !

Message cité 1 fois
Message édité par Roane le 14-10-2005 à 17:01:39

---------------
http://www.alsacreations.com, http://www.openweb.eu.org. Mon CV : http://cv.roane-irkana.net. A ne surtout pas prendre en exemple : http://www.worldinternet.be
n°1223435
DrWatson
_@''
Posté le 14-10-2005 à 17:23:18  profilanswer
 

mechkurt a écrit :

accessible ca vaut pas dire que les sources sont caché, de tout facon cacher des sources javascript :heink: ...
ca veut dire que si l'utilisateur a le javascript desactivé (comme environ 10% des gens) il ne pourra pas naviguer sur ton site...


 
 
j'avais pas pensé à ça, de toute façon tout faire en css ça me branche bien et les liens que gatsusat m'a donné vont bien m'aider :)


---------------
.:: Feed-Back  ::. Choisis un travail que tu aimes, et tu n'auras pas à travailler un seul jour de ta vie.
n°1223437
DrWatson
_@''
Posté le 14-10-2005 à 17:24:03  profilanswer
 

Roane a écrit :

L'overlib ? Loooooool :D
 
Edit : FlorentG ! FlorentG ! Y a quelqu'un pour toi !


 
 
explique stp, c'est quoi le souci avec overlib :??: ça a l'air lourd mais ça tourne impec et on a le choix entre plein d'options  :??:


---------------
.:: Feed-Back  ::. Choisis un travail que tu aimes, et tu n'auras pas à travailler un seul jour de ta vie.
n°1223439
DrWatson
_@''
Posté le 14-10-2005 à 17:24:57  profilanswer
 

gatsusat a écrit :

ton menu est bien innacessible, en desactivant le JS, on a plus accès à koi ke ce soit. LE JS de nos jours
et non pas comme 95% des gens font, est intrusif.
 
en gros le JS attaque le code HTML et lui rajoute des fonctionnalités.


 
 
merci pour les explications, en attendant de mettre mieux en place, je rajouterais une petite note comme quoi il est nécessaire d'activer js dans son navigateur :)


---------------
.:: Feed-Back  ::. Choisis un travail que tu aimes, et tu n'auras pas à travailler un seul jour de ta vie.
n°1223447
mechkurt
Posté le 14-10-2005 à 17:34:11  profilanswer
 

vive le css!


---------------
D3
n°1223452
gatsusat
Posté le 14-10-2005 à 17:39:28  profilanswer
 

DrWatson a écrit :

merci pour les explications, en attendant de mettre mieux en place, je rajouterais une petite note comme quoi il est nécessaire d'activer js dans son navigateur :)


 
Nan il n'est pas nécessaire, le JS c'est une merde inventée pour faire Chier !
 
Bocou de pro ici désactive le JS pour naviguer. Moi c'est tout autre, j'ai des raccourcis rapides pour le desactiver.  
 
un site qui nécessite le JS pour fonctionner, c'est un site malconcu


---------------
Les CSS c'est bon mangez-en
n°1223457
DrWatson
_@''
Posté le 14-10-2005 à 17:47:30  profilanswer
 

n'étant pas webmaster de formation, je suis déjà content de manier un peu le php+mysql+css, maîtriser le html, et me dépatouiller en graphisme un minimum. J'en apprend tous les jours quand j'en ai le courage et la motivation :)
 
mon prochain but ce sera de me passer de ma iframe mais je sais pas encore comment faire, tout comme là www.trance-goa.com j'ai encore de la frame :/


---------------
.:: Feed-Back  ::. Choisis un travail que tu aimes, et tu n'auras pas à travailler un seul jour de ta vie.
n°1223557
DrWatson
_@''
Posté le 14-10-2005 à 22:03:54  profilanswer
 

j'ai regardé les deux liens et bcp de menus utilisent du js :lol:

n°1223559
DrWatson
_@''
Posté le 14-10-2005 à 22:04:59  profilanswer
 

par exemple j'ai besoin de sous menus alors celui ci m'irait très bien : http://css.alsacreations.com/modelesmenus/hd1.htm#
 
j'ai fais afficher le code source et là :
 
<dl>  
  <dt onmouseover="javascript:montre('smenu4');">Menu 4</dt>
   <dd style="display: none;" id="smenu4">
    <ul>
     <li><a href="#">Sous-Menu 4.1</a></li>
     <li><a href="#">Sous-Menu 4.2</a></li>
     <li><a href="#">Sous-Menu 4.3</a></li>
 
    </ul>
   </dd>
 </dl>

n°1223596
xtof_83
Freeride Spirit
Posté le 14-10-2005 à 23:56:00  profilanswer
 

DrWatson a écrit :

j'ai regardé les deux liens et bcp de menus utilisent du js :lol:


 
 
Normal des Menu CCS 100% ne marche que sous FF.
IE respectant à fond les normes W3C :lol:  :lol:  
 
 
Bientôt , bientôt...

n°1223629
gatsusat
Posté le 15-10-2005 à 05:09:41  profilanswer
 

là ce n'est pas la meilleure méthode.
 
tiens un exemple de mmenu en JS ET CSS
http://gatsu.ftp.free.fr/html/Exem [...] cence.html
 
c'est représenté suos forme d'arborescence, mais je peut très bien mettre le menu à l'horizontale.
 
un conseil, evite de prendre le code de cette page car :
-Il y a un paquet de lignes que tu pourais peut etre pas comprendre au niveau du Js, mais j'ai super commenté la chose.
-Le code JS, est du code intrusif, il se debrouille tout seul pour rajouter les fonctionnalités.
-Ca fait bloat et faut que j'optimise le bousin
-C'est encore en version béta et j'ai fait ca juste pour m'occuper et le fun


---------------
Les CSS c'est bon mangez-en
n°1223699
DrWatson
_@''
Posté le 15-10-2005 à 13:09:39  profilanswer
 

xtof_83 a écrit :

Normal des Menu CCS 100% ne marche que sous FF.
IE respectant à fond les normes W3C :lol:  :lol:  
 
 
Bientôt , bientôt...


 
 
j'ai hate, parce que j'en ai trouvé un chouette rien qu'en css mais ie ne l'affiche pas du tout, et malheureusement on doit encore faire avec vu que cela représente la majorité. Bon autrement dit, autant garder mon menu js actuel :/

n°1223702
DrWatson
_@''
Posté le 15-10-2005 à 13:11:58  profilanswer
 

@gatsusat : oui mais comme y'a du js de toute façon, cela revient au même que je garde mon menu actuel non :??: parce que là j'étais prêt à me défonser pour un truc 100% css mais je suis deg que ça passe pas sous ie. Savez vous si ie7 sera déjà plus "normalisé" ?

n°1223703
DrWatson
_@''
Posté le 15-10-2005 à 13:14:25  profilanswer
 

question con : dans votre code source vous mettez toujours \n à la fin de chaque ligne pour avoir un code sourse aussi clair quand on l'affiche ?

n°1223709
DrWatson
_@''
Posté le 15-10-2005 à 13:45:43  profilanswer
 

finalement mon menu en js fonctionne bien avec un class='lien2', j'avais juste oublié de mettre des \ avant chaque ' :)

n°1223717
gatsusat
Posté le 15-10-2005 à 14:06:56  profilanswer
 

tu as regardé le code source ?
 
ce n'est en aucun cas du HTML généré à partir du Javascript.
 
là tu as la page telle qu'elle apparait, j'ai montré 3 exemples du menu.
 
1 menu avec JS et CSS
1 menu avec CSS seulement SANS JS
et un menu sans rien
dans les 3 cas c'est le meme code HTML
sauf que pour le premier je lui applique des CSS et du JS (via un id sur le menu)
le deuxieme seulement les CSS
et le troisieme, rien du tout


---------------
Les CSS c'est bon mangez-en
n°1223888
DrWatson
_@''
Posté le 16-10-2005 à 01:25:36  profilanswer
 

oui j'ai regardé et le seul qui pourrait m'interesser est le premier

n°1223900
Roane
Pingouino's fan
Posté le 16-10-2005 à 09:18:13  profilanswer
 

Ce que gatsusat essaie de t'expliquer, c'est que son menu fonctionne avec ou sans JS, et avec ou sans CSS. C'est donc un bon menu.
 
Le tien, il ne fonctionne pas du tout sans JS. Ca c'est carrément moins bon d'un coup :)


---------------
http://www.alsacreations.com, http://www.openweb.eu.org. Mon CV : http://cv.roane-irkana.net. A ne surtout pas prendre en exemple : http://www.worldinternet.be
n°1223912
mansour
Posté le 16-10-2005 à 10:49:07  profilanswer
 

salut,
 
je vais te donner la réponse sans discuter  ;)  
 
dans ta feuille de style tu mais ça

Citation :


#seconde-hover a:hover { color: #6EAD00; text-decoration: none; }


 
puis dans page  
 
tu fais <div align="center" id="seconde-hover">TON TEXTE ICI</div> .
 
ce n'est pas obligé de prendre la balise div !
 
tu peux prendre la balise que tu veux puis a l'interieur de la balise  
 
tu mets  <ta balise id="seconde-hover">  ;)  
 
voila  
 
 

n°1223946
DrWatson
_@''
Posté le 16-10-2005 à 13:03:09  profilanswer
 

Roane a écrit :

Ce que gatsusat essaie de t'expliquer, c'est que son menu fonctionne avec ou sans JS, et avec ou sans CSS. C'est donc un bon menu.
 
Le tien, il ne fonctionne pas du tout sans JS. Ca c'est carrément moins bon d'un coup :)


 
 
merci pour la traduction, effectivement j'avais pas capté

n°1223947
DrWatson
_@''
Posté le 16-10-2005 à 13:04:33  profilanswer
 

mansour, un peu compliqué comparé à la réponse donnée par gatsusat (deuxième post ;) ) mais je garde ça sous le coude pour tester merci

n°1223949
DrWatson
_@''
Posté le 16-10-2005 à 13:12:32  profilanswer
 

Dans mon menu ie je ne trouve pas la désactivation du javascript, j'ai trouvé pour les applets java mais ça n'a aucun rapport. Je n'ai pas encore regardé dans firefox

n°1224328
FlorentG
Unité de Masse
Posté le 17-10-2005 à 11:40:39  profilanswer
 

DrWatson a écrit :

explique stp, c'est quoi le souci avec overlib :??: ça a l'air lourd mais ça tourne impec et on a le choix entre plein d'options  :??:


44ko monstrueux pour un truc qui s'affiche pas sans JS et qui est configurable que-dalle en fait :D
 
Tu fait ton machin en HTML normal, que tu fais figurer dans ta page. Pis 10 lignes de JS pour gérer ça [:spamafote] Donc on peut faire 100x mieux facilement :(

mood
Publicité
Posté le   profilanswer
 

 Page :   1  2  3  4
Page Précédente

Aller à :
Ajouter une réponse
  FORUM HardWare.fr
  Programmation
  HTML/CSS

  [CSS] a:hover - menu - overflow - imbrication - div - dl - dd - dt

 

Sujets relatifs
CSS : Flottement de tableaux combiné avec du texte justifié[XHTML;CSS] Problème de scroll
Pb javascript pour un menu (Map)[RESOLU][Access / SQL] Erreur OVERFLOW lors de l'update de ma BDD !
[CSS] div et paddingProblème de CSS sous Firefox et IE
CSS généré par PHP reconnu par IE mais pas par Firefox??menu déroulant qui déroule bien
préchargement en CSS pour roll over (trouvé)[css][resolu] centrer un menu.
Plus de sujets relatifs à : [CSS] a:hover - menu - overflow - imbrication - div - dl - dd - dt


Copyright © 1997-2022 Hardware.fr SARL (Signaler un contenu illicite / Données personnelles) / Groupe LDLC / Shop HFR