Jak usunąć linki podkreślenia za pomocą CSS? Zasiłek dla początkujących

18.02.2019

Język projektowania stron internetowych CSS wydaje się łatwy do zrozumienia i wykorzystania, dlatego każdy początkujący twórca stron internetowych pędzi do przodu, często bez dokładnego poznania struktury i podstawy tego języka znaczników. Nie jest to zaskakujące, ponieważ kaskadowe arkusze stylów pozwalają zaprojektować stronę internetową, po prostu wymieniając jej niezbędne właściwości, które można skopiować z podręcznika raz lub dwa razy.

Problemy zaczynają się, gdy taki webmaster napotyka czyjś kod, gubi się w nim i nie rozumie zasad interakcji elementów na stronie. Ze względu na próby manipulowania kodem, strona zaczyna wyglądać chaotycznie, niezręcznie, jakby została wszczepiona na początku Internetu w latach 90. - wszystkie łącza są niebieskie lub fioletowe, a także mają podkreśloną, przerażająco przestarzałą konstrukcję. Nauczymy się szybko i łatwo rozwiązać ten problem, używając odpowiednich selektorów i deklaracji wartości.

Instrukcja: jak usunąć linki podkreślenia w CSS

Właściwość tekst-dekoracja jest odpowiedzialna za podkreślenie tekstu. Do końca Aby usunąć podkreślone linki CSS na stronie, możemy użyć jednej z następujących metod:

css usuwa podkreślające linki

  • bezpośrednio do znacznika HTML link, przypisz atrybut stylu, w którym piszesz: text-decoration: none ;
  • przypisz id do linku i zastosuj do niego podobne właściwości;

usuń podkreślone linki css

  • Aby usunąć podkreślenie CSS dla kilku elementów, należy przypisać do nich klasę z atrybutem klasy i ustawić tę samą właściwość co dla pojedynczego łącza.

css usuń podkreślone linki po najechaniu myszą

Między innymi istnieje sposób w CSS usuń podkreślenie linków na całej stronie, do tego musisz użyć następującej składni:

  • a {dekoracja tekstu: brak;}.

Pułapki podczas pracy w CSS z łączami

Jeśli chodzi o zmianę wyglądu elementów pola akcji, dla programisty bez doświadczenia wszystko staje się jeszcze trudniejsze. Ale nie rozpaczaj, rozwiązanie jest tak proste i eleganckie jak w poprzednim przypadku ze standardowym wyglądem elementu.

Linki są bardzo wybredne pod względem zarządzania nimi za pomocą CSS. Na przykład intuicyjnie wydaje się, że jeśli ustawisz kolor tekstu dla akapitu na czerwono, link w nim powinien być czerwony - ale go tam nie było. Dla każdego linku potrzebne jest "indywidualne" podejście, a jeśli wyrażać je bardziej technicznie poprawne - najpierw, w CSS musimy podać albo id, albo klasę, albo selektor "a" jako jego lokalizację w dokumencie internetowym, dla którego chcemy ustawić właściwości. Jeśli po prostu ustawisz właściwości znacznika "a", określi to podstawowe style linków na stronie, które można ponownie przypisać do poszczególnych elementów na stronie za pomocą CSS.

Usuń zawieszone linki podczas unoszenia - proste, ale nie oczywiste

Co mamy na myśli mówiąc o linku? Z technicznego punktu widzenia jest to selektor pseudoklasowy i określa jego aktualny stan. Różnorodność pseudo-klas i ich funkcjonalność są tak rozległe, że można je zidentyfikować jako osobny artykuł, a teraz interesuje nas tylko jedna pseudo-klasa - hover. To on jest odpowiedzialny za zachowanie linku (lub dowolnego innego znacznika HTML) po najechaniu myszą. Teraz, rozumiejąc strukturę przetwarzania kodu przeglądarki przez przeglądarkę, możesz użyć tego przykładu:

  • a: hover {text-decoration: none}.

Możesz przestudiować pozostałe pseudoklasy i pracować z nimi samemu, korzystając z podręczników i podręczników na temat CSS, ale aby pracować z podkreślonymi linkami w całości, ten artykuł jest wystarczający.