CSS Rimuovere sottolinea dal collegamento
Esempio 01:
Diamo un'occhiata al primo esempio di HTML per aggiungere il collegamento all'interno della pagina Web HTML. Quindi, discuteremo di un modo per rimuovere la sottolineatura di questo collegamento. Abbiamo generato un nuovo file di testo con il titolo "CSS". Questo file è stato aperto nel codice Visual Studio. Abbiamo iniziato il nostro codice con l'uso del tag HTML principale, "HTML". All'interno del tag "head" di questo script HTML, abbiamo utilizzato il tag "Titolo" per nominare o titolo per la nostra pagina Web, "Rimuovi sottolineare".
All'interno del tag del corpo, abbiamo aggiunto i nostri contenuti da visualizzare sulla pagina web con l'aiuto di alcuni utili tag HTML. Il primo tag che abbiamo usato è il tag di intestazione della dimensione 2, "H2". L'H2 è la seconda testa più grande negli script HTML. Questa intestazione verrà visualizzata sulla pagina web senza alcun stile e in un altro formato. Il prossimo tag che abbiamo usato è il tag paragrafo, "P". Contiene un semplice testo insieme al collegamento in esso che è allegato ad esso con il tag "a" di ancoraggio seguito dal "href" per aggiungere l'URL. Questo link può essere un percorso per un'immagine sul tuo computer locale o sulla pagina Web online. Abbiamo fornito il percorso a un'immagine nel nostro computer locale (i.e., indice.png.) Qualunque cosa tu abbia fornito nel tag "A" di ancoraggio sarà sottolineato ed evidenziato su una pagina web. Si tratta dell'uso dei collegamenti su una pagina HTML. Salviamo ed eseguiamo questo codice utilizzando il pulsante Esegui dalla barra delle applicazioni del codice Visual Studio. Esegui questo codice con il browser Chrome.
La pagina web denominata "Rimuovi sottolinea" è stata aperta nel browser come si può vedere dall'output seguente. C'è un "collegamento con sottolineatura" sullo schermo bianco. Dopodiché, hai un semplice paragrafo a una linea sotto di esso con un link allegato alla sua parola "logo". Puoi vedere che la parola "logo" è sottolineata ed evidenziata in colore blu. Tocca la parola "logo" per vedere cosa viene fuori.
La pagina web è stata indirizzata all'immagine a livello mostrato (indice.jpg) posizione che si trova sul nostro computer locale. L'immagine contiene un semplice logo animato.
Aggiorniamo il nostro codice HTML per rimuovere la riga utilizzata per sottolineare la parola chiave del collegamento "logo". Per questo, abbiamo aggiornato prima H2 (i.e., "Link senza sottolineatura"). Dopo questo, abbiamo usato il tag CSS "Style" all'interno del tag di ancoraggio "A" per impostare la proprietà "delerazione del testo" su "Nessuno". La proprietà "Decorazione del testo" impostato su "Nessuno" rimuoverà tutto lo styling applicato al particolare "logo" della parola chiave del collegamento e lo renderà un semplice testo normale. Salviamo prima questo codice.
Dopo aver eseguito il codice aggiornato nel browser, abbiamo la riga di paragrafo e aggiornato. La parola "logo" è stata evidenziata così com'è, ma la sottolinea è stata rimossa da essa. D'altra parte, la parola chiave "logo" funziona ancora come collegamento e ti indirizza all'immagine.
Esempio 2:
Diamo un'occhiata al nuovo esempio per rimuovere la sottolineatura dai collegamenti forniti nella pagina Web HTML. Questo esempio sarà diverso perché abbiamo utilizzato due collegamenti di diversi tipi nel tag paragrafo interno di un tag del corpo per uno script HTML. Abbiamo aggiunto due titoli e due paragrafi nel corpo di una pagina web tramite tag. Il primo e il secondo titoli: "Link with sottoline", mostra che entrambi i collegamenti saranno sottolineati. All'interno dei tag di paragrafo, abbiamo utilizzato il tag di ancoraggio "A" per aggiungere collegamenti a URL specifici. Il primo URL di paragrafo è stato puntato verso lo stesso indice di immagine.png. Un tag in stile CSS è stato utilizzato per impostare il colore di questa parola chiave del collegamento "logo" su viola secondo la proprietà del colore. Il secondo URL di paragrafo è stato puntato verso il nuovo URL per un semplice file di testo situato sul nostro computer locale (i.e., test.txt) e il tag in stile CSS è stato utilizzato per impostare il colore della sua parola chiave di collegamento "file" su marrone secondo la proprietà del colore.
Abbondiamoli con l'aiuto di un tag di stile nel tag principale di un file HTML. Abbiamo impostato i margini di 15 pixel per intestazioni e paragrafi mentre abbiamo impostato anche le proprietà del collegamento e hover. La proprietà di decorazione del testo sta utilizzando il valore "sottolinea" per sottolineare entrambe le parole chiave. Lo spessore della linea è stato impostato su 6 pixel. Il colore della proprietà hover è stato impostato su "Aqua". Salviamo e eseguiamo il debug questo codice in Visual Studio ora.
L'output per il codice sopra ha mostrato due titoli con due paragrafi. La parola chiave "logo" sottolineata contiene il percorso dell'immagine mentre la parola sottolineata "file" ti indirizzerà verso il file di testo (i.e., test.TXT.)
Quando si tocca la parola chiave "file", ti indirizzerà al test.file txt come mostrato di seguito.
Quando si libra su una qualsiasi delle parole evidenziate dai paragrafi a flusso mostrato, il colore di una parola e la sua sottoline.
Per rimuovere la sottolineatura da entrambe le parole di collegamento, dobbiamo impostare la decorazione del testo della proprietà per un collegamento a "nessuno". Non abbiamo aggiornato il resto del codice per evitare gli eventuali inconvenienti. Per vedere i suoi meccanismi, dobbiamo salvarlo prima di Ctrl+S, quindi eseguirlo utilizzando il pulsante "Esegui" dal codice Visual Studio.
L'output per questo codice aggiornato ha mostrato due paragrafi ciascuno con la parola di collegamento "logo" e "file" rispettivamente. La sottolineatura in fondo a entrambe le parole è stata rimossa con successo senza causare alcun problema.
Conclusione:
La dimostrazione di rimozione di una sottolineatura dal collegamento è stata eseguita all'interno di questo articolo. Per questo, abbiamo utilizzato la proprietà di decorazione del testo all'interno dello styling in linea e dello stile out-line di uno script HTML. L'uso dell'elemento hover insieme allo spessore e alla proprietà del colore di un collegamento è stato molto utile in tutto l'articolo. Dopo aver esaminato tutte le illustrazioni di HTML fornite in questo articolo, sarai in grado di ottenere le conoscenze e la chiara comprensione dei collegamenti, il loro stile e la rimozione delle sottoiniezioni sotto di loro.