Come Browser Web visualizzare i documenti HTML

April 9

Come Browser Web visualizzare i documenti HTML


Quando gli utenti navigano a una pagina Web, il contenuto HTML viene inviato dal server al browser, in cui viene visualizzato. I principali elementi che partecipano alla visualizzazione di una pagina Web sono markup HTML e CSS (Cascading Style Sheets). strutture HTML definiscono il contenuto del documento, che può includere testo, immagini, video e altri tipi di supporto. dichiarazioni CSS dettare come il browser deve visualizzare gli elementi HTML nel documento. Ci sono piccole differenze tra i diversi browser durante la visualizzazione HTML.

disposizione

HTML e CSS definiscono come elementi della pagina web devono essere disposte l'una rispetto all'altra. Gli elementi HTML in una pagina sono contenuti all'interno dei tag:

<Div> Un elemento di pagina </ div>

Questi elementi possono essere disposti in vari modi. Il browser utilizza gli elementi stessi e le dichiarazioni CSS per decidere come la pagina deve essere presentata. regole CSS dichiarano larghezze e le posizioni degli elementi:

div {width: 80%; float: left;}

Ciò significa che il "div" occuperà 80% della larghezza del suo elemento di contenimento e siederà sullo stesso accesso orizzontale di qualsiasi elemento flottante alla sua sinistra, fornendo questi inseriscono all'interno dell'elemento di contenimento.

Testo

Un certo numero di tipi di elementi HTML può contenere testo per la visualizzazione per gli utenti, con CSS definire font, la dimensione del testo, lo stile del testo, allineamento e colore. L'esempio seguente mostra alcuni HTML testo contenuto all'interno di un paragrafo:

<P> Alcuni testo del paragrafo </ p>

Il browser visualizzerà automaticamente questo con nuove linee, in modo efficace le interruzioni di riga, prima e dopo l'elemento "p". Questo codice CSS definisce vari aspetti del testo per il browser in modo da riflettere quando la pagina viene presentato:

p {font-family: Arial, Helvetica, sans-serif; font-size: grande; font-weight: bold; color: # 00FFFF; text-align: center;}

Il Modello Box

Il Modello Box in CSS è un metodo per istruire il browser riguardante l'area ad essere occupata da elementi. Ogni elemento HTML può avere una larghezza specifica, un'area di padding aggiunto a ciascun lato, un bordo attorno all'elemento compresa la zona imbottita, quindi un margine esterno che, definendo un'area intorno all'elemento che non può contenere altri elementi. Le misurazioni utilizzati possono essere fissi, come il seguente esempio:

div {padding: 10px; margin: 5px;}

Le misurazioni possono essere alternativamente rispetto alle dimensioni dell'elemento, come in questo esempio:

div {width: 100px; padding: 5%; margin: 2%;}

immagini

Immagini in HTML possono essere visualizzati sia in primo piano e sfondo. immagini in primo piano sono compresi all'interno del codice HTML, dicendo al browser per visualizzarli insieme agli altri elementi nel documento, come segue:

<Img alt = "una foto" />

Alternativamente immagini possono essere visualizzate sullo sfondo, dietro alcuni elementi come nell'esempio CSS dicendo al browser l'immagine da visualizzare dietro uno specifico tipo di elemento, e come deve essere visualizzata:

div {background: # 000000 URL ( 'backpicture.jpg') repeat-x;}

L'immagine viene ripetuta lungo l'asse "x" e un colore nero visualizzato dietro qualsiasi altra parte visibile dell'elemento.