Nwlapcug.com


Come includere immagini esterne da una postazione remota con i CSS

Con Cascading Style Sheets (CSS), su una delle tue pagine, è possibile includere un'immagine all'esterno del sito Web. I tre modi per dare un elemento attributi CSS sono gli stili inline, fogli di stile interni e fogli di stile esterni. Attenersi alla seguente procedura per includere immagini esterne da una postazione remota con i CSS.

Istruzioni

Stili in linea

1

Trovare il codice per l'elemento che si desidera inserire un'immagine in. In questo caso, è

. 2

Inserire il seguente codice tra la fine del tag di apertura dell'elemento e la parentesi quadra di chiusura:

Style = "background-image: url(image_url); Larghezza: X px; Altezza: px Y; "

Dove image_url è l'URL della tua immagine remota, X è la larghezza dell'immagine in pixel e Y è l'altezza. Così, nel nostro esempio, sarebbe diventato il nostro div:

<div style = &quot;url(http://www.fake.com/images/fake.gif); width: 30px; height: 30px;&quot;></div>

Foglio di stile interno

3

Trovare il tag nel codice della pagina Web. Dovrebbe essere verso la parte superiore del codice.

4

Spostare il tag basso di una riga. Se il tag è situato su una linea con altro codice, spostarlo in una propria linea e quindi spostare verso il basso un altro.

5

Inserire il codice seguente nella riga sopra il tag:

6

Inserire il seguente codice tra la fine del tag di apertura dell'elemento e la parentesi quadra di chiusura:

classe = "bri"

Così, nel nostro esempio, sarebbe diventato il nostro div

<div class = &quot;bri&quot;></div>

Consigli & Avvertenze

  • Utilizzare fogli di stile interni per riempire un numero di elementi con la stessa immagine. In questo caso, si darebbe la classe = attributo "bri" ogni elemento si voleva riempito. In questo modo, è possibile aggiungere altri tag CSS per gli elementi di classe "bri" senza modificare ogni elemento, nella parte superiore del documento.
  • È possibile utilizzare fogli di stile esterni, mettendo il codice all'interno il foglio interno (vale a dire i tag) in un documento separato. Quindi, invece di mettere i tag prima il tag, inserire: si può mettere dove FILENAME.css è il nome del nuovo file di foglio. Questo consente di utilizzare lo stesso foglio per un numero di pagine, che è ottimo se si desidera utilizzare gli stessi stili in tutte le pagine.
  • Quando si visualizza un'immagine remota sulla tua pagina, gli spettatori saranno essere scaricando dalla postazione remota. Questo mangerà la larghezza di banda di quel luogo remoto. Altri webmaster potrebbe non prendere gentilmente a questo; Essi si potrebbe recisi dalla comprese le immagini dal loro dominio, o si può presentare un reclamo al tuo host Web circa il vostro abuso delle loro immagini. Ottenere prima il permesso.