Come rimuovere i bordi da un'immagine Link

March 9

Browser evidenziano link a pagine web per impostazione predefinita. Gli stili di collegamento di default sono in genere di colore blu o viola, con testo collegato sottolineato e bordi intorno immagini collegate. Purtroppo, luminoso bordi blu intorno le immagini collegate possono distrarre dal vostro disegno visivamente piacevole. Peggio ancora, se il layout è composto da diverse immagini collegate che si fondono insieme per creare una singola immagine, i bordi delle immagini creano linee attraverso il layout e distruggere l'effetto. Rimozione bordi intorno un'immagine collegata è facile da raggiungere utilizzando Cascading Style Sheet (CSS) lingua da aggiungere uno stile di bordo alle immagini. È possibile applicare uno stile a singole immagini una alla volta, o aggiungere uno stile radicale che rimuove i bordi da tutte le immagini sulla vostra pagina.

istruzione

Rimuovere il bordo da una singola immagine

1 Aprire la pagina Web in un editor di testo.

2 Individuare il codice per l'immagine che si desidera modificare. Il codice, chiamato "tag, \" \ inizierà con \ "<img \" e hanno un attributo denominato \ "src \" che è impostato al nome del file dell'immagine. Ad esempio, per un'immagine \ "mypic.jpg, \" il tag di immagine potrebbe essere simile a questo:

<Img src = \ larghezza "mypic.jpg \" = \ "100 \" height = \ "200 \">

3 Digitare il seguente codice attributo di stile dopo la \ "<img \" parte del tag, con uno spazio prima e dopo il nuovo codice:

style = \ "border-style: none; \"

Ad esempio, il tag \ "mypic.jpg \" sarebbe ora simile a questa:

<Img style = \ "border-style: none; \" src = \ larghezza "mypic.jpg \" = \ "100 \" height = \ "200 \">

4 Salvare la pagina web. Aprire in un browser web per assicurarsi che le modifiche hanno lavorato. Potrebbe essere necessario aggiornare o ricaricare la pagina per vedere i cambiamenti. La aggiornare o ricaricare il comando si trova di solito in \ del browser menu "Visualizza \".

Rimuovere i bordi da tutte le immagini collegate

5 Aprire la pagina Web in un editor di testo.

6 Individuare la sezione di intestazione della pagina web. Aggiungere il seguente codice dopo il tag iniziale <head> e prima del tag di chiusura </ head>:

<Style type = \ "text / css \">
un img {

border-style: none

GO
}
</ Style>

La "a IMG \" parte del codice \ racconta la pagina \ "ecco lo stile per ogni tag img all'interno di un ancoraggio (cioè collegamento,) tag nella pagina web. \" Il codice tra le parentesi graffe {} è il stile da applicare. Questo tipo di stile è utile quando un sacco di immagini collegati a cui si desidera rimuovere i bordi, ad esempio su una pagina web galleria fotografica. Lo stile si applicherà solo alle immagini collegate, lasciando i bordi dell'immagine non collegati intatta.

7 Salvare la pagina web. Aprire in un browser web per assicurarsi che le modifiche hanno lavorato. Potrebbe essere necessario aggiornare o ricaricare la pagina per vedere i cambiamenti. La aggiornare o ricaricare il comando si trova di solito in \ del browser menu "Visualizza \".

Consigli e avvertenze

  • Se si desidera cambiare il modo in cui il confine sembra invece di rimuoverlo, utilizzare lo stile \ "border \" invece di \ "border-style \" per impostare la dimensione, stile del bordo e il colore in una sola riga di codice CSS. Ad esempio, un sottile bordo d'argento sarebbe stato impostato con \ "border: 1px argento massiccio; \" Vedi le risorse sezione per le esercitazioni di approfondimento sull'utilizzo di CSS per il layout e lo stile delle pagine web.

Articoli Correlati