Come modificare menu Altezza in Spry

March 20

Come modificare menu Altezza in Spry


framework Spry Adobe consente ai progettisti Web di implementare facilmente caratteristiche dinamiche nelle loro pagine, tra cui un menu di navigazione a discesa. Adobe ha aggiunto una funzione di menu Spry a Dreamweaver come un mezzo per creare facilmente la navigazione multi-livello, ma non è sempre chiaro come personalizzare l'aspetto della barra dei menu. Invece di manipolare il menu nella visualizzazione struttura, regolare le classi CSS legati per ottenere l'aspetto desiderato.

istruzione

1 Aprire il documento CSS associato al codice HTML vostro menu Spry è stata posta in. Se si utilizza Dreamweaver, questo è il codice che è stato creato nel file SpryMenuBar.css quando il menu è stato creato.

2 Individuare il "ul.MenuBarHorizontal un" selettore. Le due attributi che controllano l'altezza della barra di navigazione primaria sono le dimensioni del testo e l'imbottitura intorno. Decidere quanto grande si desidera che il testo e aggiungere un attributo dimensione del carattere per questo selettore. Per esempio:

font-size: 14px;

3 Prendere l'altezza desiderata del menu in pixel e sottrarre la dimensione del carattere da esso. Dividere questo numero a due per ottenere il padding superiore e inferiore richiesto. Rimuovere l'attributo imbottitura esistente e dei suoi valori.

4 Creare un nuovo attributo padding seguito dai nuovi valori che avete determinato. Utilizzare i valori dei pixel piuttosto che ems e inserire i valori nel seguente ordine: in alto, a destra, in basso, a sinistra. Per illustrare un menu con un'altezza di 40px e dimensione di 14px, scrivere l'attributo padding come segue:

padding: 13px 0 13px 0;

Consigli e avvertenze

  • Centrare il testo del link all'interno del suo blocco relativo utilizzando il "text-align: center" attributo.