В прошлый раз я писал о некоторых особенностях работы браузеров Google Chrome и Safari, а сейчас расскажу о паре простых приемов, позволяющих легче управлять правилами CSS и сделать вид ссылок более дружелюбным.
Выставление приоритета с помощью !important
В CSS приорите отдается тому правилу, которое указано последним. Пример:
a { text-decoration:underline } ... a { text-decoration:none }
Если вы в файле style.css укажете сначала, что ссылку нужно подчеркивать, а в конце укажете, что подчеркивать не нужно, то главным будет считаться последнее правило – ссылка не будет подчеркнута. Это простой пример. Но бывают и сложные случаи, например, файл style.css, состоящий из тысячи строк, и разобраться в нем не всегда под силу новичку. Если вы хотите, чтобы указанное вами правило было самым главным, независимо от того, в каком месте файла оно находится, используйте метку [codei lang=”css”]!important. Пример:
a { text-decoration:underline; color:#CCC } ... a { text-decoration:underline !important; color:#FF0000 !important } ... a { text-decoration:none; color:#AAA }
Приоритетным будет считаться второе правило – ссылка будет подчеркнутой и красного цвета.
Запрет переноса длинных ссылок
Если анкор ссылки слишком длинный, состоящий из нескольких слов, то при попадании на конец строчки такая ссылка может быть разделена на две части – начало останется на первой строке, а окончание перенесется на строчку ниже. Иногда такое поведение портит всю картину. Чтобы предотвратить разбиение анкора ссылки на части и его перенос, нужно указать для ссылки такое правило:
a { white-space: nowrap }
Свойство nowrap предотвратит разбиение ссылки – она будет теперь одной строчкой, и если эта строчка попадает на перенос, то переносится весь анкор, без дробления на части. Однако нужно помнить, что это правило работает только внутри какого-нибудь элемента. Если же сам элемент не вписывается по ширине и ломается на части, то nowrap не поможет – нужно сжимать весь элемент.