Back to top

Autore Topic: Domanda secca su classi di suffisso  (Letto 2670 volte)

Offline baggio

  • Nuovo arrivato
  • *
  • Post: 46
    • Mostra profilo
Domanda secca su classi di suffisso
« il: 01 Lug 2012, 15:46:44 »
Ciao a tutti vi volevo porre una domanda secca!


Le classi di suffisso sono molto utili per personalizzare il css dei moduli, ma c'è un grande problema:


-se a un modulo customHTML diamo Module class suffix:_ciao e non aggiungiamo nella cartella css di joomla un file css con nuove regole del tipo


.custom_ciao {bla bla bla;}


il modulo tende ad ereditare le regole css gia esitenti.


Questo è un problema!!


esiste il modo per non permettere a un modulo di ereditare le regole css esistenti?




Vi pongo questo problema perchè molto spesso accade che se dobbiamo  creare una pagina html all'interno di un  modulo custom html con i relativi css(attraverso il procedimento del module class sufffix), il contenuto del modulo verrà visualizzato diversamente da come ci immaginiamo perchè alcuni tag andranno a ereditare le regole di css gia esistenti.


Possibile che bisogna specificare anche altre  regole css(che non ci interesserebbero)  per bloccare quelle che si ereditano?


Ho fatto del mio meglio per essere chiaro e coinciso,


Grazie in anticipo


Il divin Codino


ps: se il divin codino giocasse stasera saremo già a festeggiare!! Forza azzurri!!!!!!!!!!!!!!!!!!!!!!!!!!!!


Offline Parossismo

  • Appassionato
  • ***
  • Post: 242
    • Mostra profilo
Re:Domanda secca su classi di suffisso
« Risposta #1 il: 01 Lug 2012, 17:23:47 »
Risposta più secca che posso: si, è obbligatorio che erediti gli stili CSS generali.

Questo a causa del funzionamento del CSS, non di joomla: il CSS funziona a cascata (Cascading Style Sheets), nella definizione degli stili si va dal generale al particolare. Quindi tutto quello che non è diversamente specificato si comporta come stabilito dalle regole generali.

Esempio:

file CSS
p  {big big big size!; font pazzesco;}
#piccolo   {0,0001 size!;}

pagina HTML
<p>primo paragrafo</p>
<p id="piccolo">secondo paragrafo</p>

Il primo paragrafo eredita le caratteristiche generali, il secondo quelle generali, a meno che non sia altrimenti specificato: nell'esempio il secondo paragrafo eredita il font generale ma varia la size.
Spero sia abbastanza chiaro.
Ciao, a presto!

Offline Npaquito

  • Abituale
  • ****
  • Post: 1832
    • Mostra profilo
Re:Domanda secca su classi di suffisso
« Risposta #2 il: 01 Lug 2012, 17:27:52 »
web design, web mobile

mau_develop

  • Visitatore
Re:Domanda secca su classi di suffisso
« Risposta #3 il: 01 Lug 2012, 19:21:44 »
..tu pensa quel poveraccio che ha lavorato una vita per arrivare a creare e standardizzare il css e legge questo post... :)

M.

Offline baggio

  • Nuovo arrivato
  • *
  • Post: 46
    • Mostra profilo
Re:Domanda secca su classi di suffisso
« Risposta #4 il: 02 Lug 2012, 08:03:42 »
Allora innanzitutto Grazie delle risposte ma credo allora che non mi sono spiegato bene.


So come funzionano i suffissi di classe e conosco i css abbastanza bene, ma forse non abbastanza per credere che lo "standardizzatore dei css" posso aver risolto tutti i problemi :-)


Vi faccio un esempio concreto che non è spiegabile attraverso le precedenti risposte.


-La situazione è joomla 2.5, template beez_20, l effetto hover dei link è blu.
 Vorrei creare un nuovo  modulo custom html   in cui i link non abbiano l effetto hover blu ma che abbiano un altro effetto hover che al passaggio del mouse i caratteri aumentino di dimensione.


PROBLEMA:
se specifico



1).custom_ MenuCiao  a:hover{
   
   font-size: 36px;
}
Aumenta carattere ma non sparisce effetto "backround-color(ereditato): blu"



2).custom_MenuCiao a:hover{
   display: none;
}
 sparisce l' effetto "backround-color(ereditato): blu"  ma anche  quello dell'aumento carattere



3).custom_MenuCiao a:hover{
font-size: 36px;
 background-color: #FFF;
}
Nel caso in cui il backround del modulo sia bianco, potremo risolvere assegnando backround-color:#FFF
Ma se il backround del modulo fosse variopinto e non un colore pieno? ??? ?? Questo metodo non funzionerebbe, allora ho pensato al punto 4 qui sotto



4).custom_MenuCiao a:hover{
   

font-size: 36px;
   background-image: url(images/trasparente.png);
}
Questo è l unico stratagemma che mi è venuto in mente: per neutralizzare l effetto  "backround-color(ereditato): blu"  ma allo stesso momento inserirne un altro(aumento dimensioni per esempio),  potremo inserire in background-image  un file trasparente png in modo che al passaggio del mouse l effetto hover non si noti.
IMPORTANTE: NOn sempre basta dare un colore pieno al backround, esempio bianco, perchè il backround del modulo potrebbe essere una foto etc...






Sono sicuro che ha questo ci sia una soluzione piu semplice. Ma non vedendola capirete la mia esigenza di sapere se è possibile NON FAR EREDITARE le regole ad alcuni selettori.


Ma son sicuro che "quel poveraccio che per una vita ha standardizzato i css dopo aver letto questo post avrà una soluzione":-)
« Ultima modifica: 02 Lug 2012, 08:07:49 da baggio »

Offline Npaquito

  • Abituale
  • ****
  • Post: 1832
    • Mostra profilo
Re:Domanda secca su classi di suffisso
« Risposta #5 il: 02 Lug 2012, 08:19:06 »
Hola

perche no

.custom_ MenuCiao  a:hover{
font-size: 36px;
display: none;
background-color: #FFF;
...
}
nell'articolo lincato non a caso copiano la classe originale intera e si cambiano solo alcune propietà
« Ultima modifica: 02 Lug 2012, 08:24:12 da Npaquito »
web design, web mobile

Offline Parossismo

  • Appassionato
  • ***
  • Post: 242
    • Mostra profilo
Re:Domanda secca su classi di suffisso
« Risposta #6 il: 02 Lug 2012, 10:57:21 »
.custom_ MenuCiao  a:hover {
background-color:transparent;
}

vedi in merito: http://www.w3schools.com/cssref/pr_background-color.asp
alla voce "property values"

 



Web Design Bolzano Kreatif