Come creare un pulsante di FrontPage 2003 con il codice HTML

March 1

Microsoft FrontPage 2003 permette alle persone con poca o nessuna conoscenza di web design per creare, pubblicare e gestire siti web. Esso fornisce semplici modi per inserire testo e Hyper collegamenti, aggiungere immagini, e modificare i font del documento e colori. Il programma offre anche la funzionalità Interactive Button, che consente agli utenti di generare automaticamente gli elementi di navigazione, senza l'utilizzo di un programma di editing di immagini. Tuttavia, pulsanti interattivi richiedono sei immagini per stile pulsante, una limitazione impraticabile per i progettisti alla ricerca di una soluzione HTML puro. Per fortuna, la creazione di pulsanti HTML solo in FrontPage è un compito relativamente semplice.

istruzione

1 Aprire la pagina che si desidera modificare. Con FrontPage 2003 aperto, selezionare \ "File \" dal menu nella parte superiore dello schermo, quindi fare clic su \ "Apri. \" Individuare la pagina che si desidera modificare. Aprire con un doppio clic sulla sua icona.

2 Aggiornare il collegamento che si desidera trasformare in un pulsante. Scansione tua pagina, trovare il link che si desidera trasformare in un pulsante, quindi evidenziarlo. Fare clic sul pulsante nella parte inferiore della schermata con l'etichetta \ "Codice. \" Questa azione porta in primo piano la modalità di visualizzazione del codice di FrontPage, che vi mostra il codice HTML della pagina. Il tuo link apparirà evidenziato e un aspetto simile al seguente: <a href=\"contact.html\"> Contattaci </a>

Aggiornare il link in modo che il tag di apertura appare in questo modo: <a href=\"contact.html\" class=\"button\"> Contattaci </a>. La proprietà di classe aggiunto permette di modificare l'aspetto di questo collegamento.

3 Creare una regola di stile per il pulsante. Scorrere fino nella parte superiore della pagina in vista Codice e individuare il tag etichettato </ head>. Aggiungere una riga vuota immediatamente sopra questo tag. Copia il codice qui sotto e incollarlo a questa riga vuota:

<Style type = \ "text / css \">
<! -
un bottone {
background-color: grey
ANDARE
colore bianco
ANDARE
padding: 10px
ANDARE
text-decoration: none
ANDARE
}

a.button: hover {
background-color: orange
ANDARE
colore nero
ANDARE
padding: 10px
ANDARE
text-decoration: none
ANDARE
}
->
</ Style>

Questo codice imposta gli stili associati con il pulsante. Essa richiede un pulsante con 10 pixel di padding su tutti i lati che è di colore grigio al caricamento della pagina, ma diventa arancione quando l'utente sposta il mouse su di esso. Modificare questi parametri per creare un pulsante con l'imbottitura e colori di sfondo della vostra scelta.

4 Salvare la pagina e visualizzare il pulsante nel browser. Selezionare \ "File \" dal menu nella parte superiore dello schermo, quindi selezionare \ "Salva. \" Avviare il browser e aprire la pagina appena modificato in FrontPage. Il link ora ha l'aspetto di un pulsante, ma il suo aspetto è controllato solo attraverso HTML; non sono richieste immagini.