Jak usunąć podkreślenie linków? Właściwość CSS do dekorowania tekstu

12.03.2019

Linki są integralną częścią każdej strony internetowej. Mogą to być zarówno tekst, jak i przyciski. Ten artykuł dotyczy tylko linków tekstowych.

Nie jest tajemnicą, że w HTML wszystkie elementy nie wyglądają bardzo zgrabnie, a projekt, szczerze mówiąc, jest zły.

Najważniejszą częścią "linku", który ingeruje w tworzenie linków, jest podkreślenie. Teraz zrozumiemy, jak usunąć podkreślające linki w CSS.

Tworzenie linków

Aby zademonstrować działanie tej metody, musisz utworzyć łącze. Pomoże to w standardowym HTML 5.

Aby utworzyć łącze, musisz użyć znacznika pair "a", który nie jest blokiem. Dlatego w celu umieszczenia linków w oddzielnych liniach konieczne jest umieszczenie ich w tagach akapitu (p). Alternatywnie możesz użyć właściwości display: block dla każdego linku.

Zacznij tworzyć linki. Wprowadzamy kilka tagów w naszym dokumencie HTML. Pomiędzy znacznikami otwierającymi i zamykającymi wpisujemy nazwę naszego linku, który będzie wyświetlany na naszej stronie.

Ponadto znacznik "a" ma wiele atrybutów. Atrybut href jest obowiązkowy, bez którego link nie będzie przestrzegany. Wskazuje ścieżkę do strony lub pliku, do którego prowadzi nasz link.

W przedstawionym przykładzie nie będą używane żadne inne łącza, dlatego możesz podać standardową wartość #.

Link jest tworzony, teraz musi być stylizowany. Istnieje kilka sposobów na usunięcie podkreślonych linków w CSS:

  1. Atrybut stylu (umieszczony wewnątrz znacznika).
  2. Znacznik stylu (umieszczony w bloku głowicy).
  3. Zewnętrzne style połączenia za pomocą tagu linku.

Aby cofnąć podkreślenie łącza w CSS, możesz użyć dowolnej z tych metod, ale połączenie zewnętrznych stylów jest uważane za najbardziej odpowiednie.

Kod HTML

Wskazówka: podczas stylizowania strony internetowej preferuj linki zewnętrzne.

Łącza do stylizacji w CSS

W przedstawionym przykładzie zostanie użyte zewnętrzne łącze. Otwórz plik CSS, w którym zmienimy wygląd linków.

Oprócz linków na tej stronie nie ma nic. Dlatego użyjemy znacznika "a" jako selektora. Jeśli wolisz, możesz dodać klasy dla każdego linku, ale jest to opcjonalne.

Napisz selektor "a", w którym zostanie zapisana własność dekoracji tekstowej: brak;

Jedna prosta właściwość dekorowania tekstu służy do usuwania podkreśleń za pomocą CSS.

Dekoracja tekstowa zawiera szereg innych wartości. Dzięki niemu możesz stworzyć górny podkreślnik, ale rzadko jest on używany.

Aby usunąć podkreślenie linku, w dokumencie CSS wpisz następujący kod:

Kod CSS

Aby uprościć kod, możesz użyć prostego atrybutu - stylu. W tym przykładzie cała strona nie jest reprezentowana w pełnoprawnym projekcie, więc możesz użyć tej metody.

Najważniejsze, żeby nie malować całej strony HTML w taki sposób. W tym kodzie bardzo łatwo można się pogubić.

Modyfikowanie indukowanego łącza w CSS

Załóżmy, że chcesz, aby linki w normalnym stanie podkreślenia pozostały i znikną po najechaniu myszą. Aby usunąć lub ustawić podkreślenie dla linku po najechaniu kursorem, CSS używa pseudoklasy ": hover". Oto przykład:

Kod CSS dla zaindukowanego łącza

Style mogą być stosowane nie tylko do wywołanego łącza, ale także do aktywacji lub odwiedzin. Aby to zrobić, użyj pseudoklasy ": active" i ": visited".