Come fare un banner CSS

June 7

Come fare un banner CSS


Striscioni sono immagini che si crea e si inserisce in una pagina Web, ma si ha la possibilità di utilizzare i fogli di stile (CSS), invece. Con i CSS, il tuo banner sarà un file di dimensioni inferiori, portando a tempi di caricamento delle pagine più veloce. Un banner CSS ti dà anche la possibilità di modificare rapidamente gli elementi di design modificando il codice. Utilizzare editor di testo del computer per costruire un banner CSS.

istruzione

1 Avviare il programma di editor di testo e aprire il file sito web. Posizionare il cursore tra i tag <head> tag.

2 Inserisci questo codice CSS prima del <head /> elemento di chiusura:

<Style type = "text / css">

Banner {}

</ Style>

Il "#banner {}" tra i tag di stile inizia una regola distinta che costruisce il tuo banner.

3 Digitare i seguenti attributi tra le parentesi graffe:. "Width", "altezza", "font-size", "font-family:" "imbottitura", "background-color" e "stile di confine"

4 Inserire i valori numerici in pixel (px) dopo la "larghezza" e "altezza" per specificare le dimensioni della bandiera desiderati. Il codice dovrebbe essere simile:

bandiera {width: 500px; altezza: 300px; }

5 Digitare un valore di pixel dopo "font-size" e inserire un font-family per determinare la modalità di visualizzazione del testo del banner. Inserire un valore imbottitura per stabilire la quantità di spazio che appare tra il confine di testo e banner. Per esempio:

bandiera {font-size: 24px; font-family: Arial, Helvetica, sans-serif; padding: 10px; }

6 Inserire un valore esadecimale del colore dopo "background-color" per determinare l'ombra. Digitare una dimensione dei pixel, lo stile della linea e il valore del colore dopo "border-style" per specificare come il contorno attorno ai display banner. Per esempio:

bandiera {background-color: # ffff00; border-style: #CCCCCC solido 2px; }

7 Posizionare il cursore nel codice HTML dove vuoi che il tuo banner di apparire e digitare la seguente per inserirlo sulla pagina:

<Div id = "banner">

Inserisci CSS per banner qui

</ Div>

8 Salvare il file.

Consigli e avvertenze

  • Separare ogni attributo CSS con un punto e virgola per garantire il lavoro stili. Per esempio:
  • #banner {
  • width: 500px;
  • altezza: 300px;
  • font-size: 24px;
  • font-family: Arial, Helvetica, sans-serif;
  • padding: 10px;
  • background-color: # ffff00;
  • border-style: #CCCCCC solido 2px;
  • }