• "Pavés" menu en tête


    Mercredi 4 Juillet à 10:29
    randonnee

    bonjour à tous

    Est il possible de créer des "pavés" à "COINS ARRONDIS" à l'aide du menu de l'en tête?

    de nombreux essais m'ont permis d'en réaliser avec contours, couleurs...différents  mais je n'ai pas trouvé cette possibilité "d'arrondir" les coins

    merci à vous

    Jeudi 5 Juillet à 09:48
    stormalo

    Bonjour,

    Essaye ce code sur sur seniors-club-domerat.eklablog.com/#

    #cssmenu > ul > li {border: 3px solid blue; border-radius: 10px; margin:2px}

    Les points bleus qui apparaitront avec ce code sont dus à des balises <li> </li> qui sont vides de contenu**  ; contexte à modifier pour ne pas avoir ces points.

    ** (ne contiennent qu'une ligne commentaire <!--     --> )

     bonne journée

    Jeudi 5 Juillet à 09:57
    randonnee

    Rebonjour

    J'ai du mal formuler ma question....

    mon menu d'en tête me convient bien (c'est d'ailleurs grâce à vous je crois que je l'ai réalisé)

    ce que je voudrais , c'est une sorte de "bouton d'urgence" ( a l'aide de "menu d'en tête" ou autre)..pour prévenir des évènements à venir (inscriptions sortes, fêtes...etc) qui attirerait l'oeil des adhérents ......

    ( j'ai placé " évènements a venir, cliquez" en haut à gauche....mais c'est nul

    merci de votre aide , bonne journée

    Vendredi 6 Juillet à 21:47
    stormalo

    Ah oui, bien que tous les deux séniors on n'était pas sur la même fréquence he

     

    Dans le css ajouté au thème il y a ce sélecteur #menu a { .... }  ligne 286,

    1) je mettrais le fond en jaune pour attirer l’œil 
    background-color: #FF0au lieu de #FFF

    2) la bordure je la trouve mieux en double simple (avis perso)
    border-style: doubleau lieu de ridge

    3) et pour les arrondis il faut utiliser la propriété border-radius, en ajoutant cette ligne :
    border-radius: 40px;
    ça donne ceci:



    Finalement la réponse précise à ta question initiale c'est mon point 3)

    Reste a adapter ça aux gouts locaux

    Vendredi 6 Juillet à 21:51
    randonnee

    Merci beaucoup!!!!!!!!!!!!!!!!!

    J'ai appliqué, mais ...Peut on faire mieux? (oui sans doute) mais comment?

    comme ça par exemple!

    Autre chose, je n'ai pas trouvé

    " le css ajouté au thème il y a ce sélecteur #menu a { .... }  ligne 286,"

    Alors j'ai rajouté #menu a { .... } dans le css de mon blog

    Merci pour tout......

     

    Samedi 7 Juillet à 09:25
    stormalo

    Bonjour randonnée,

    je te propose de placer visuellement ton image (avec un lien) par dessus le header

    Pour affichage uniquement en accueil du blog, mettre dans le code source de la page d'accueil:

    <style><!--
    #lien-commencer { position: absolute;    left: 80px;    top: 340px; }
    --></style>
    <p><a href="http://seniors-club-domerat.eklablog.com/-c30086410"><img id="lien-commencer" src="http://ekladata.com/Dk2bYOehIX-l9-YoWKeMGBe1iKw.png" alt="" /></a></p>


    Pour affichage dans d'autres situations
    - la ligne css entre <style> et </style> peut être placée en ajout css dans le thème
    - le html de <p> à </p> peut être placé dans le code source d'une ou plusieurs rubriques, ou d'un module simple (dans ce dernier cas pour aff. permanent)

    ====================

    Le thème css de ton blog est ici :
    http://seniors-club-domerat.eklablog.com/theme-771584-1165.css

    ====================

    Pour un besoin en affichage version mobile voir dans Trucs et Astuces

    Dimanche 8 Juillet à 08:14
    randonnee

    Merci STORMALO

    Je comprends (un peu), il s'agit de mettre en fait une image...je vais essayer d'en créer une plus adaptée....

    par contre j'ai détruit mon "déroulant" ligne 4 de la "page de garde"...peux tu me dire d'où vient l'erreur

    merci

    Dimanche 8 Juillet à 08:41
    stormalo

    bonjour,

    Oui, il s'agit de placer par dessus le header une image cliquable (porteuse d'un lien)

    ----------------------------

    L'erreur provient du fait que tu as copié la partie <style> ......</style> à l'intérieur d'un  balisage <p> ... </p>

    C'est à dire que tu as placé une mini feuille de style à l'intérieur d'un paragraphe. L'éditeur à tenté de corriger, cela à coupé en deux ton code <marquee> ....</marquee>

     A refaire ! wink2

    ----------------------------

    Edit 09:13

    Si ça peut être utile, je viens de récupérer ta version du 04/07/18 dans le cache de Google.

    <p style="width: 955px; border: 2px solid red; padding: 5px; font-size: 20pt; xt-align: center; color: red; box-shadow: 6px 6px 10px red; border-radius: 5px; background-color: black;"><marquee onmouseover="this.stop();" onmouseout="this.start();" direction="left" scrollamount="5">...BONNES VACANCES A TOUS.!!!!!!.... .</marquee></p>

    Dimanche 8 Juillet à 09:21
    randonnee

    MERCI....Je continue

     Voilà, Qu'en pensez vous?  (je n'ai pas encore mis le lien correspondant)

    Maintenant j'attaque les tableaux

    Dimanche 8 Juillet à 17:48
    stormalo

    Je trouve que les couleurs sont bien en harmonie avec celles de la page, mais je dois laisser mon imagination faire bouger la clochette. smile




    Vous devez être membre pour poster un message.