Как да премахнем връзките за подчертаване чрез CSS? Помощ за начинаещ

18.02.2019

Езикът за проектиране на уеб страници на CSS изглежда измамно лесен за разбиране и използване, поради което всеки начинаещ уеб разработчик се втурва напред към амбразурата, често без задълбочено да научи структурата и основите на този език за маркиране. Това не е изненадващо, защото каскадните таблици със стилове ви позволяват да проектирате уеб страница, като просто посочите необходимите му свойства, които могат да бъдат копирани от учебника веднъж или два пъти.

Проблемите започват, когато такъв уебмастър се сблъсква с някой друг код, се губи в него и не разбира принципите на взаимодействие на елементите на страницата. Поради опитите за манипулиране на кода, страницата започва да изглежда хаотично, тромаво, сякаш е била имплантирана в зората на интернет през 90-те години - всички връзки са сини или лилави, а също така имат подчертано ужасно остаряла в дизайна. Ще се научим да решаваме този проблем бързо и лесно, като използваме правилните селектори и декларации за стойност.

Инструкция: как да премахнете връзките за подчертаване в CSS

Свойството за декориране на текст е отговорно за подчертаването на текста. Напълно За да премахнете долните CSS връзки на страницата, можем да използваме един от следните методи:

css премахване на подчертаване връзки

  • директно към маркера за HTML връзка, задайте атрибут на стила , в който да пишете: text-decoration: none ;
  • присвояване на id на връзката и прилагане на подобни свойства към нея;

премахнете подчертаващите css връзки

  • За да премахнете подчертаването на CSS за няколко елемента, трябва да им присвоите клас с атрибута class и да зададете същото свойство както за единична връзка.

css премахва подчертаните връзки при задържане на мишката

Наред с другите неща, има и начин в CSS премахнете подчертаването на връзки на цялата страница, за това трябва да използвате следния синтаксис:

  • a {text-decoration: none;}.

Падащи при работа в CSS с връзки

Когато става въпрос за промяна на външния вид на полевите елементи на действие, за разработчик без опит, всичко става още по-трудно. Но не се отчайвайте, решението е толкова просто и елегантно, както в предишния случай със стандартния вид на елемента.

Връзките са много придирчиви по отношение на управлението им чрез CSS. Например, интуитивно изглежда, че ако зададете цвета на текста за абзац в червено, то връзката в нея трябва да е червена - но тя не е била там. За всяка връзка е необходим „индивидуален“ подход и ако го изразим по-технически точен - първо, в CSS трябва да посочим id, или class, или selector „a“ като неговото местоположение в уеб документа, за който искаме да зададем свойства. Ако просто зададете свойства за "а" маркер, това ще определи основните стилове на връзката на страницата, които могат да бъдат пренасочени към отделни елементи на страницата с помощта на CSS.

Премахване на подчертаване връзки, когато зависване - просто, но не е очевидно

Какво имаме предвид, когато препращаме към връзка? От техническа гледна точка това е селектор на псевдоклас и определя текущото му състояние. Разнообразието от псевдокласове и тяхната функционалност са толкова обширни, че могат да бъдат идентифицирани като отделна статия, а сега се интересуваме само от един псевдоклас - hover. Той е този, който е отговорен за поведението на връзката (или всеки друг HTML таг), когато се движи. Сега, разбирайки структурата на обработката на браузъра на кода, можете да използвате този пример:

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

Можете да изучавате останалите псевдокласове и да работите с тях сами, като използвате справочници и учебници по CSS, но за да работите с подчертани връзки в пълен размер, тази статия е достатъчна.