Come mettere una foto nel titolo di una pagina web

December 9

Come mettere una foto nel titolo di una pagina web


Il titolo di una pagina Web è la spesso la prima cosa che un incontro spettatori. Come tale, esso serve ad introdurre il contenuto della pagina e può presentare lo stile per l'intero sito Web. Un'immagine può essere una grande risorsa per il titolo della pagina Web, aumentando il testo. In HyperText Markup Language (HTML), ci sono due modi in cui è possibile incorporare le immagini nel vostro titolo.

istruzione

L'immagine

1 Ottenere o progettare un'immagine in un programma di editing di immagini. Se si utilizza un'immagine che non è il proprio, assicurarsi di avere il permesso di copyright e dare credito al creatore. Se si sta creando una icona, assicurarsi che è di 16 pixel per 16 pixel e ha sia la .ico estensione o .png.

2 Assicurarsi che l'immagine non rende il testo della pagina invisibile se usato come sfondo. Se il testo è nero e si intende inserire un'immagine sotto di esso, assicurarsi che l'immagine è adeguatamente schermato e non troppo scuro.

3 Salvare l'immagine nella stessa cartella come la pagina Web.

Immagine come sfondo

4 Aprire la pagina Web in un programma di elaborazione testi. Assicurarsi di utilizzare il \ "Apri con ... \" funzione invece di fare doppio clic sul file HTML in sé.

5 Se si vuole mettere un'immagine dietro il titolo della pagina nella finestra del browser è necessario per lo stile l'immagine in modo appropriato. Anche se questo può essere realizzato all'interno del codice HTML, utilizzando i fogli di stile (CSS) consente una maggiore flessibilità.

6 In CSS, apportare modifiche al tag body. Usa background-image per specificare l'immagine, background-repeat per spegnere ripete, e background-position per specificare la posizione della vostra immagine. Per esempio:

body {

background-image: URL(\"yourimage.jpg\")

ANDARE

background-repeat: no-repeat

ANDARE

background-position: 50% 0%

ANDARE

}

Le modifiche background-position alterano la posizione dell'immagine rispetto alla sua casella di imbottitura. Sono elencati in x%, ordine y%. In questo esempio, l'immagine è 50% di tutti i box (in altre parole, al centro) e 0% per casella (superiormente).

7 Aprire la pagina Web in un browser Web e assicurarsi che le immagini vengono visualizzate, se lo desideri. Apportare le modifiche necessarie al codice HTML e CSS.

l'icona

8 Al fine di creare un'icona che andrà accanto al tuo documento nella scheda del browser Web (spesso chiamato "favicon \" \), è necessario modificare il tag <head> del codice HTML. Aprire la pagina Web in un programma di elaborazione testi.

9 Se l'icona non è un file .ico, convertirlo in uno utilizzando l'icona software di conversione.

10 Nel tag <head>, inserire il seguente tag <link> per l'icona:

<Link rel = \ href "icona di collegamento \" = \ "TuaIcona.ico \">