Від автора: інтернет працює на посиланнях. Крім усього іншого, в посилань дуже суворі обмеження по стилям, здебільшого з міркувань безпеки. Дизайнери, наприклад, Marcin Wichary помітили, що ці обмеження впливають на розбірливість посилань, тому вони запропонували свої способи обходу цих заборон. CSS стандарти розвиваються, і багато з цих проблем поступово вирішуються, що покращує юзабіліті і зовнішній вигляд посилань.
Властивість text–decoration–skip
За замовчуванням посилання мають синій колір з підкресленням. Підкреслення заходить на нижні виноски таких літер, як j, що ускладнює читання посилань. Є безліч обхідних шляхів вирішення цієї проблеми, але тепер в CSS є свій спосіб – властивість text–decoration–skip. У властивості дуже багато значень, але ціль завжди одна – вказати місця, де підкреслення не повинно отрисовыватться.
Більшість дизайнерів зацікавить значення ink, вирішальне описану вище проблему. Це значення обриває підкреслення в місцях з нижніми виносками букв. Ефект можете подивитися на початку статті.
a { text–decoration–skip: ink; }
В Safari 10 така поведінка вбудовано за замовчуванням. У всіх інших браузерах у властивості text–decoration–skip за замовчуванням стоїть значення none.
У властивості text–decoration–skip є значення spaces, з яким підкреслення не буде перестрибувати між словами. Є й інші значення, більш докладно див. у статті на Mozilla Developer Network.
На даний момент властивість text–decoration–skip підтримується в Safari, Chrome підтримки немає. Однак у Chrome Canary підтримка є, що, можливо, призведе незабаром до підтримки і в звичайному Chrome.
Властивість text-decoration-color
За замовчуванням колір підкреслення посилання успадковується від кольору тексту. Існує безліч способів встановити інший колір, найпростіший через border-bottom замість text-decoration. Однак тепер в CSS є прямий спосіб змінювати колір підкреслення:
a { text–decoration–color: #ccc; }
Підтримка у text–decoration–color майже така ж, як у text–decoration–skip: обидва підтримуються в Chrome Canary, але просто Chrome і інших браузерах немає.
Висновок
Поки що обидва властивості мають слабку підтримку в браузерах, але це скоро зміниться, і в майбутньому їх варто використовувати в своїх стилях. Якщо вам важливі такі дрібниці типографського витонченості, можу запропонувати парочку ресурсів:
Створюємо підкреслення посилань на Medium
Розумні підкреслення посилань для кожного сайту
