Próbuję wyświetlać łącze w kolorze białym, bez podkreślenia. Kolor tekstu jest wyświetlany poprawnie jako biały, ale niebieskie podkreślenie uparcie się utrzymuje. Próbowałem text-decoration: none;
i text-decoration: none !important;
w CSS, aby usunąć łącza podkreślenie. Żaden nie działał.
.boxhead .otherPage {
color: #FFFFFF;
text-decoration: none;
}
<div class="boxhead">
<h2>
<span class="thisPage">Current Page</span>
<a href="myLink"><span class="otherPage">Different Page</span></a>
</h2>
</div>
Jak mogę usunąć niebieskie podkreślenie z linku?
Odpowiedzi:
Tak jak się spodziewałem, nie stosuje się
text-decoration: none;
do anchor (.boxhead a
), ale do elementu span (.boxhead
).Spróbuj tego:
źródło
.toc-list a > span{text-decoration:none !important;}
Myślę, że pytanie @ JMTyler jest uzasadnione; Szukam tego samego rozwiązania.text-decoration
to, że nie obsługuje przesłonięcia zagnieżdżonych znaczników, jak wspomniano powyżej. Poa { text-decoration: underline; }
zastosowaniu reguły nie można jej cofnąć, npa .wish_this_were_not_underlined { text-decoration: none; }
. Za pomocą . Nie mogę znaleźć odniesienia do tego, ale takie jest moje doświadczenie (w Chrome).text-decoration: none;
więc zamiast tego postanowiliśmy ukryć linię za pomocątext-decoration: underline; text-decoration-color: white;
. / hack.boxhead .otherPage { display: inline-block; color: #FFFFFF; text-decoration: none; }
Tag zakotwiczenia (link) ma również pseudoklasy, takie jak odwiedzane, najechanie kursorem, link i aktywne. Upewnij się, że Twój styl jest zastosowany do danych stanów i że żaden inny styl nie jest w konflikcie.
Na przykład:
Zobacz W3.org, aby uzyskać więcej informacji na temat pseudoklas użytkowników: hover ,: active i: focus.
źródło
a:link
kiedy mówisza:click
text-decoration: none !important
powinienem to usunąć. Czy jesteś pewien, że nieborder-bottom: 1px solid
czai się? (Śledź obliczony styl w Firebug / F12 w IE)źródło
border-bottom-style: none;
naprawiło to dla mnie.Po prostu dodaj ten atrybut do tagu kotwicy
style="text-decoration:none;"
Przykład:
Lub skorzystaj z CSS.
źródło
Czasami to, co widzisz, to cień, a nie podkreślenie tekstu.
Spróbuj tego (używając dowolnych selektorów CSS, które są dla Ciebie odpowiednie):
źródło
.otherPage a:link {text-decoration:none;}
; powtórz to dla odwiedzonych, aktywnych i najedź kursorem w razie potrzeby.Przegapiłeś
text-decoration:none
dla tagu zakotwiczenia . Więc kod powinien być następujący.Bardziej standardowe właściwości do dekoracji tekstu
źródło
Trudno spekulować, nie widząc strony.
Ale dla mnie brzmi to tak, jakbyś mógł
border-bottom: 1px solid blue;
być zastosowany. Być może dodajborder: none;
.text-decoration: none !important
ma rację, możliwe jest, że masz inny styl, który wciąż zastępuje ten CSS.W tym miejscu korzystanie z paska narzędzi Firefox Web Developer Tool jest niesamowite. Możesz edytować plik CSS i sprawdzić, czy wszystko działa, przynajmniej w przeglądarce Firefox. Jest poniżej
CSS > Edit CSS
.źródło
Z reguły jeśli „podkreślenie” nie jest tego samego koloru co tekst [a „kolor:” nie jest nadpisany w wierszu], nie pochodzi od „dekoracji tekstu:” Musi być „border-bottom:”
Nie zapomnij też zdjąć granicy ze swoich pseudo klas!
Ten fragment kodu zakłada się, że jest zakotwiczony, zmień odpowiednio na jego opakowanie i użyj specyficzności zamiast „! Ważne” po wyśledzeniu głównej przyczyny.
źródło
Podczas gdy inne odpowiedzi są poprawne, istnieje łatwy sposób na pozbycie się podkreślenia na wszystkich tych nieznośnych linkach:
Spowoduje to usunięcie podkreślenia z KAŻDEGO POŁĄCZENIA na Twojej stronie!
źródło
Jeśli
text-decoration: none
lubborder: 0
nie działa, spróbuj zastosować styl wbudowany w pliku HTML.źródło
Po prostu użyj nieruchomości
i jesteś objęty ubezpieczeniem. Działa idealnie dla mnie, gdy w ogóle nie działa właściwość dekorowania tekstu.
źródło
Żadna z odpowiedzi nie działała dla mnie. W moim przypadku istniał standard
w moim kodzie. Zasadniczo bez względu na link, kolor tekstu zmienia się na niebieski, a link pozostaje niezmieniony.
Więc dodałem kod na końcu nagłówka w następujący sposób:
i problemu już nie ma.
źródło
źródło
Oto przykład formantu LinkButton asp.net:
Kod za:
źródło
W niewłaściwym selektorze nie użyto dekoracji tekstowej. Musisz sprawdzić, który tag potrzebujesz do dekoracji.
Możesz użyć tego kodu
LUB
LUB
źródło
Umieść następujący kod HTML przed
<BODY>
tagiem:<STYLE>A {text-decoration: none;} </STYLE>
źródło
W moim przypadku źle sformatowałem HTML. Link znajdował się w
<u>
tagu, a nie w<ul>
tagu.źródło
Jak zauważyli inni, wygląda na to, że nie możesz przesłonić zagnieżdżonych stylów dekoracji tekstu ... ALE możesz zmienić kolor dekoracji tekstu.
Jako hack zmieniłem kolor na przezroczysty:
źródło