Come modificare un'origine HTML

January 28

Come modificare un'origine HTML


Uno dei modi migliori per imparare lo sviluppo Web è quello di studiare il lavoro di altri sviluppatori. È possibile imparare i trucchi HTML, come rollover e menu animati, copiando il codice sorgente di un sito web e sperimentare con esso. Modificare l'aspetto di una pagina HTML esistente da elementi in movimento, aggiungendone di nuovi e cambiando gli attributi nella sezione Style Sheet della pagina. Se non si dispone di software di editing HTML, utilizzare Blocco note per apportare le modifiche.

istruzione

1 Visitare un sito web che ha caratteristiche visive o interattive che ti piace.

2 Fai clic su "Visualizza" nella parte superiore del browser e selezionare "Visualizza origine". Il browser si aprirà una finestra contenente il codice sorgente HTML della pagina web.

3 Fare clic su qualsiasi area della pagina e selezionare "Copia".

4 Aprire un editor HTML o Blocco note e creare un nuovo documento. Premere il tasto "CTRL + V". Windows incolla il codice HTML nel documento.

5 Premere il tasto "CTRL + V". Windows incolla il codice HTML nel documento.

6 Esaminare il codice. Vedrete i tag HTML standard quali HTML, il corpo e la testa. Se la pagina web utilizza JavaScript, si vedrà tag script pure.

7 Trova uno degli elementi della sezione corpo del documento. Ad esempio, se la pagina dispone di un pulsante, casella di input o di intestazione, trovare uno di questi e di cambiare proprietà Text dell'elemento digitando un nuovo valore.

8 Aggiungere elementi aggiuntivi alla pagina, se necessario. Ad esempio, per aggiungere una nuova immagine, aggiungere il seguente codice alla sezione del corpo:

<Img alt = "la mia immagine" />

Sostituire xyz.gif con il nome di un'immagine sul disco rigido.

9 Salvare il documento e visualizzarlo nel browser. Vedrete le modifiche apportate.

10 Tornare al documento e individua la sezione di stile nella parte superiore della pagina. Questo è dove gli sviluppatori di solito definiscono i colori, font, dimensioni e altre proprietà visive di elementi di una pagina. Per esempio, si può visualizzare una sezione stile simile a questo:

<Style>

.class1 {color: red; font-weight: bold; altezza: 100px; width: 200px; }

</ Style>

Questa classe CSS, "classe 1", si applicherà questi attributi per ogni elemento della pagina che fa riferimento la classe. Alter alcuni di questi valori, salvare la pagina e vedere come le modifiche influenzate pagina.

11 Continuare a studiare il codice HTML, modificarlo e visualizzare le modifiche nel browser. Se vedi un elemento di pagina interessante come ad esempio un menu trasparente con testo oro, trovare l'elemento nel codice sorgente e capire come lo sviluppatore ha creato l'effetto.

Consigli e avvertenze

  • Molti editor HTML hanno un pulsante "View Design". Questi pulsanti semplificano il compito di visualizzare le modifiche del HTML. Fare clic sul pulsante e si può vedere come la pagina apparirà in un browser, senza dover salvare la pagina e aprire un browser.

Articoli Correlati