я имею сайт WordPress с двенадцатой дочерней темой где я пытаюсь обострить определенные вещи. Одна из вещей, которую я хочу, — сделать боковую панель менее заметной, чтобы в идеале внимание посетителей было сосредоточено на чтении контента большую часть времени.
Некоторые ссылки на UX мотивированы. (Встроенные ссылки подчеркнуты; списки ссылок только подчеркнуты при наведении.) Таким образом, виджеты второго столбца, помимо поиска, являются кандидатами на наличие ссылок, которые обычно не подчеркиваются.
То, что я имею после примерно десятка попыток, выглядит следующим образом. Таблица стилей в основном обрабатывает все виджеты правого столбца после поиска как одинаковые для подчеркивания ссылки.
В пользовательском интерфейсе, если вы посмотрите на правый столбец, исключая виджет, используемый для отображения столбца изображений:
1-й и 3-й виджеты, за исключением столбца обложек книг, имеют подчеркнутые ссылки,
2-го и 4-го нет.
1-й, 2-й и 3-й используют произвольный текстовый виджет.
Я прыгнул акулу в отладке.
Я часами включал и выключал вещи в style.css, сложение и вычитание "text-decoration: none,"
"text-decoration: underline,"
"!important,"
и т.д., и ничего не получалось.
Фрагмент ниже использует самую тяжелую кувалду, которую я мог найти. Эффект, который я ожидал, заключался в том, что я назначал (jQuery.css()) inline !important
стиль, и это просто невозможно превзойти.
;(jQuery(function()
{
jQuery.css('aside#secondary a', 'text-decoration: none !important');
jQuery.css(
'aside#secondary a:hover', 'text-decoration: underline !important');
})());
Я попробовал в файле JavaScript сайта и временно добавил скрипт в footer.php. Ничего такого. Мне все еще не удалось заставить подчеркивания уйти.
Я не выяснил, что вызывает это; Я старался изо всех сил, но я не в состоянии обеспечить минимальную демонстрацию проблемы; Я не знаю смелости WordPress.
Спасибо,
Проблема в том, что, очевидно, подчеркивание достигается не с text-decoration: underline
CSS свойство, но с box-shadow: 0 1px 0 0 currentColor
,
Попробуйте переопределить его следующим образом с помощью css или js:
box-shadow: none;
Дайте мне знать, если это поможет,
Других решений пока нет …