Visualizzazione risultati 1 fino 9 di 9

Discussione: Impostare uno stile diverso per H2, H3, ecc.

  1. #1
    Data registrazione
    11-02-2009
    Messaggi
    240

    Predefinito Impostare uno stile diverso per H2, H3, ecc.

    Ciao a tutti!
    Quando scrivo un articolo nel sito, imposto i vari H2, H3, H4, ecc. ai titoli dei vari paragrafi. Vorrei che ognuno abbia uno stile proprio (non so se è il termine adatto) che venga automaticamente impostato.
    Ad esempio, vorrei che un titolo H2 sia scritto in rosso, corsivo, carattere 15; H3 deve essere in blu, neretto e carattere Times New Roman 13; e così via...
    Suggerimenti?

  2. #2
    L'avatar di alemoppo
    alemoppo è connesso ora Staff AV
    Data registrazione
    24-08-2008
    Residenza
    PU / BO
    Messaggi
    12,460

    Predefinito

    Sicuramente potresti farlo con un CSS personalizzato, tipo:
    Codice:
    H3{
    color:#00F;
    font-weight: bold;
    font-family: ...
    }
    Forse esistono anche plugin che fanno questa cosa, prova a cercare un attimo. Altrimenti puoi sempre utilizzare CSS, se hai dei problemi fai sapere.

    Ciao!

  3. #3
    Data registrazione
    11-02-2009
    Messaggi
    240

    Predefinito

    Citazione Originalmente inviato da alemoppo Visualizza messaggio
    Sicuramente potresti farlo con un CSS personalizzato, tipo:
    Codice:
    H3{
    color:#00F;
    font-weight: bold;
    font-family: ...
    }
    Forse esistono anche plugin che fanno questa cosa, prova a cercare un attimo. Altrimenti puoi sempre utilizzare CSS, se hai dei problemi fai sapere.

    Ciao!
    Grazie della risposta!
    Ho provato ad aggiungere il codice ma non funziona. E' come se le impostazioni di base del sito prevalgano su quelle che aggiungo nel CSS personalizzato.

  4. #4
    L'avatar di alemoppo
    alemoppo è connesso ora Staff AV
    Data registrazione
    24-08-2008
    Residenza
    PU / BO
    Messaggi
    12,460

    Predefinito

    Vedo che lo hai aggiunto, ma è commentato:
    Codice:
    /* 
    h2 {
      font-family: sans-serif;
      font-size: 30px;
      margin-top: 30px;
    }
    aggiunto per modificare lo stile di H2 */
    Si tratta di quello?

    Ciao!

  5. #5
    Data registrazione
    11-02-2009
    Messaggi
    240

    Predefinito

    Sì, era quello prima che lo modificassi.
    Facendola semplice, ho visto che se inserisco questo codice per cambiare il colore dell'H2
    Codice:
    h2 {
      color:red;
    }
    il colore di H2 resta nero.
    Funziona se invece aggiungo !important, in questo modo.
    Codice:
    h2 {
      color: red !important;
    }
    E' un modo corretto?

    Questa è una pagina di esempio.
    Ultima modifica di medicinapertutti : 26-09-2018 alle ore 17.16.35

  6. #6
    L'avatar di alemoppo
    alemoppo è connesso ora Staff AV
    Data registrazione
    24-08-2008
    Residenza
    PU / BO
    Messaggi
    12,460

    Predefinito

    Nella riga 308 viene impostato:
    Codice:
    #page-content h2
    Quindi, con:
    Codice:
    #page-content h2 {color:red;}
    Dovrebbe funzionarti correttamente.

    Ciao!

  7. #7
    Data registrazione
    11-02-2009
    Messaggi
    240

    Predefinito

    Funziona sia con #page-content h2 che con .post-content h2, a patto che ci aggiunga !important
    Attualmente ho inserito il seguente codice e mi sta bene:
    Codice:
    .post-content h2 {
      color: #0e6ebe !important;
      font-weight: bold;
      margin-top: 30px;
    Ciò che ora non capisco è che se provo a fare modifiche simili a .av-latest-post-single h4 (sarebbe il testo che compare nel widget "Ultimi articoli"), alcune modifiche le fa ma altre no.
    Ad esempio, attualmente c'è:
    Codice:
    .av-latest-post-single h4 {
      display: inline-block;
      font-size: 20px;
      font-family: Georgia, serif;
    }
    ma se quel testo, ad esempio, lo volessi fare rosso (con color: red;), non capisco perché non va.

    Grazie delle risposte!
    Ultima modifica di medicinapertutti : 26-09-2018 alle ore 18.56.13

  8. #8
    L'avatar di alemoppo
    alemoppo è connesso ora Staff AV
    Data registrazione
    24-08-2008
    Residenza
    PU / BO
    Messaggi
    12,460

    Predefinito

    Citazione Originalmente inviato da medicinapertutti Visualizza messaggio
    Funziona sia con #page-content h2 che con .post-content h2, a patto che ci aggiunga !important
    A me risulta che con
    Codice:
    #page-content h2 {color:red;}
    funziona senza !important.


    Citazione Originalmente inviato da medicinapertutti Visualizza messaggio
    Ciò che ora non capisco è che se provo a fare modifiche simili a .av-latest-post-single h4 (sarebbe il testo che compare nel widget "Ultimi articoli"), alcune modifiche le fa ma altre no.
    Ad esempio, attualmente c'è:
    Codice:
    .av-latest-post-single h4 {
      display: inline-block;
      font-size: 20px;
      font-family: Georgia, serif;
    }
    ma se quel testo, ad esempio, lo volessi fare rosso (con color: red;), non capisco perché non va.
    Prova con:
    Codice:
    #page-content .ashe-widget a
    {
      color:red;
    }
    EDIT:
    Se vuoi solamente i titoli degli ultimi articoli, prova così:
    Codice:
    #page-content .ashe-widget h4 a
    {
      color:red;
    }
    Ciao!
    Ultima modifica di alemoppo : 26-09-2018 alle ore 19.05.23

  9. #9
    Data registrazione
    11-02-2009
    Messaggi
    240

    Predefinito

    Citazione Originalmente inviato da alemoppo Visualizza messaggio
    A me risulta che con
    Codice:
    #page-content h2 {color:red;}
    funziona senza !important.
    Hai ragione, evidentemente avevo sbagliato qualcosa.




    Citazione Originalmente inviato da alemoppo Visualizza messaggio

    EDIT:
    Se vuoi solamente i titoli degli ultimi articoli, prova così:
    Codice:
    #page-content .ashe-widget h4 a
    {
      color:red;
    }
    Ciao!
    Se invece volessi solamente i titoli degli articoli più letti?

    Grazie mille, alemoppo! Cercherò di non disturbare più dopo. :)

Regole di scrittura

  • Non puoi creare nuove discussioni
  • Non puoi rispondere ai messaggi
  • Non puoi inserire allegati.
  • Non puoi modificare i tuoi messaggi
  •