Come disegnare una linea verticale a HTML separato testi da immagini

April 28

È possibile separare il testo e le immagini in un documento HTML utilizzando il CSS o Cascading Style Sheets, metodo. In caso contrario, si dovrà tracciare una linea verticale in un programma di editing di immagini, salvarla e poi chiamare all'interno del documento della pagina Web. Il metodo CSS è preferibile, perché consente di risparmiare tempo, riduce i tempi di caricamento delle pagine e meglio utilizza la larghezza di banda del server. È necessario avere una conoscenza di base di HTML e CSS fondamentali per completare questa operazione.

istruzione

1 Aprire il documento HTML in un editor di testo, come Blocco note di Windows o Mac TextEdit.

2 Inserire il seguente codice CSS, per creare una classe di "confini", tra i tag head del documento HTML:

<Style type = "text / css">

.borders {border-left-color: blue;

-Sinistra-stile del bordo: solido;

border-left-width: 1px;

padding-left: 6px; }

</ Style>

3 Vai alla sezione corpo del documento HTML e digitare il seguente codice prima il testo:

<Table>

<Tr>

<Td>

4 Spostare il cursore sotto il testo e digitare il seguente codice:

</ Td>

<Td class = "confini">

5 Inserire l'immagine nella colonna della tabella digitando:

<Img src = "http://www.example.com/image.jpg">

</ Td>

</ Tr>

</ Table>

6 Salvare il documento HTML e pubblicare sul server di hosting Web.

Consigli e avvertenze

  • È possibile modificare il colore della linea verticale modificando il CSS è stato inserito tra i tag head HTML.
  • Quando si include il testo in un documento HTML, la pratica migliore è quella di racchiudere ogni blocco di testo tra i tag di paragrafo.