Как грамотно подчеркнуть ссылки в Twitter Bootstrap 3?
Хочу подчеркнуть все ссылки с помощью border-bottom (именно так, а не text-decoration).
Проблема заключается в том, что если прописать стили глобально всем тегам a, то полетят стили всех компонентов бутстрапа использующих тег a (buttons, navs, navbar, dropdowns и проч.), а я этого не хочу.
Я нашел три способа решения проблемы:
1. Присвоение всем нужным ссылкам класса .underlined { border-bottom-width: 1px; }
2. Штудирование исходников бутстрапа с последующим запиливанием border-bottom: 0 !important; в нужные места
3. Конструкции а-ля a:not(.btn)
Но все они, мягко сказать, хреновые.
Может, кто-нибудь уже сталкивался с подобной задачей?
text-decoration в бутстрап встречается 20 раз, думаю, всё можно решить путём автозамен:
все "text-decoration: none;" заменить на "border-bottom: none;"
все "text-decoration: underline;" заменить на "border-bottom: 1px solid #xxx;"
в самом верху в "ресетах" прописать в тег а "text-decoration: none;border-bottom: 1px solid #xxx;"
ну и ещё там в паре мест, где visited, на ховерах т.д. нужно покрасить бордер в цвет шрифта, работа 10 минут...
Средний
