Nwlapcug.com


Come aggiungere bordi dal menu CSS



Con il codice di ripristino automatico di sistema (CSS, Cascading Style Sheet), è possibile modificare i bordi, colori e posizioni. Web designer scoprire nuovi trucchi di stile usando i CSS ogni giorno, ma uno degli usi più comuni di CSS è per progettare menu sito Web. È possibile aggiungere un bordo a qualsiasi menu e stile come necessario, specificando le cose quali larghezza, stile e colore. È possibile utilizzare bordi in combinazione con colori di sfondo, sfumature e ombre per farli risaltare.

Istruzioni

1

Aprire il file HTML che contiene il menu CSS in un editor di codice. Individuare il codice per il menu e prendere nota di entrambi il nome ID o una classe. I menu sono solitamente codificati come elenchi non ordinati, così il nome ID o una classe dovrebbe essere all'interno del tag < ul >. A volte lo troverete in un tag < div > che circondano i collegamenti del menu.

2

Apri il. CSS file per il tuo sito e individuare il nome ID o una classe per il menu. Se il tuo sito Web non utilizza un esterno. File CSS, o si non sapere, poi cercare tra i tag < head > per tag < style > e trovarlo lì. Se non trovi ancora nulla, aggiungere il codice necessario tra i tag < style >.

3

Aggiungere questo codice al codice CSS:

id di menu {border: 1px solid #eeeeee;}

Il codice precedente crea un bordo solido, grigio con una larghezza di un pixel. Modificare il numero per la larghezza del bordo desiderato e modificare "solido" a qualsiasi impostazione di stile ti piace, come "punteggiato", "tratteggiato" o "smussato". Sostituire "#eeeeee" con il nome di colore o il codice esadecimale per ogni colore che si desidera utilizzare. Modificare il codice CSS per qualcosa come questo se si utilizza un nome di classe anziché il nome ID del menu:

Class-nome {border: 1px solid #eeeeee;}

Consigli & Avvertenze

  • La proprietà di "confine" in CSS è un breve mano. È inoltre possibile ottenere specifici con proprietà, ad esempio "border-width" o "border-top-style," Se ti piace.
  • È possibile impostare bordi appaiono solo su due lati o dare ogni lato uno stile diverso.