В блоге Ильи Бирмана была опубликована заметка о способах оформления ссылок, заключенных в кавычки. Реализация того способа, который Илья называет правильным, на его собственном сайте очень проста: ссылки по умолчанию не подчеркнуты, внутри тега <a> принудительным образом подчеркивается только текст без кавычек:
Я счел это решение не слишком изящным и решил попробовать написать свой собственный способ. Мое решение было использовать псевдоклассы :before и :after, а также свойство content.
Материал для этой статьи взят из <a class="quoted" href="http://ru.wikipedia.org">Википедии</a>, свободной энциклопедии.
Во всех браузерах, поддерживающих указанные средства CSS, я вижу следующую картину:
То есть кавычки по-прежнему подчеркнуты! При наведении мыши, как и предполагалось, подчеркивание убирается. Я также пробовал вместо подчеркивания использовать border-bottom: solid 1px Blue, а для a.quoted:before и a.quoted:after указывать border-bottom: none, но также безрезультатно. Есть ли у вас какие-нибудь идеи, с чем связано подобное поведение? Возможно, оно является нормальным, я не часто работаю с :before и :after и, возможно, упускаю какие-нибудь важные моменты. В таком случае, подскажите, пожалуйста, возможные альтернативные решения этой проблемы.
You can post now and register later.
If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.
Актуальные контакты:
Telegram: @Nikker_web
E-Mail: tarasevich.email@gmail.com
Портфолио https://www.behance.net/d4d4186e
Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ
Актуальные контакты:
Telegram: @Nikker_web
E-Mail: tarasevich.email@gmail.com
Разрабатываю дизайн групп в соц сетях, сайтов, приложений, другой дизайн под заказ
Портфолио https://www.behance.net/d4d4186e
Question
mavsic
В блоге Ильи Бирмана была опубликована заметка о способах оформления ссылок, заключенных в кавычки. Реализация того способа, который Илья называет правильным, на его собственном сайте очень проста: ссылки по умолчанию не подчеркнуты, внутри тега <a> принудительным образом подчеркивается только текст без кавычек:
<a href="iscroll/" class="nou">«<u>Айскрол</u>»</a>
Я счел это решение не слишком изящным и решил попробовать написать свой собственный способ. Мое решение было использовать псевдоклассы :before и :after, а также свойство content.
А вот HTML:
Во всех браузерах, поддерживающих указанные средства CSS, я вижу следующую картину:
То есть кавычки по-прежнему подчеркнуты! При наведении мыши, как и предполагалось, подчеркивание убирается. Я также пробовал вместо подчеркивания использовать border-bottom: solid 1px Blue, а для a.quoted:before и a.quoted:after указывать border-bottom: none, но также безрезультатно. Есть ли у вас какие-нибудь идеи, с чем связано подобное поведение? Возможно, оно является нормальным, я не часто работаю с :before и :after и, возможно, упускаю какие-нибудь важные моменты. В таком случае, подскажите, пожалуйста, возможные альтернативные решения этой проблемы.
Надеюсь на вашу помощь.
Link to comment
Share on other sites
3 answers to this question
Recommended Posts
Join the conversation
You can post now and register later. If you have an account, sign in now to post with your account.
Note: Your post will require moderator approval before it will be visible.