В данной публикации нет каких либо описаний работы с функциями, таблицами стилей или тому подобным. Я просто хочу поделиться с Вами эффектом найденным мною на просторах Internet, который достигается при помощи технологии CSS3 выделения цветом.
Вы можете посмотреть данный эффект по этой ссылке. Это нужно видеть ! ( работает только в браузерах Safari и Firefox.
Поскольку Internet Explorer имеет “свое толкование таблиц стилей CSS” а бывают задачи, или же необходимость сделать кроссбраузерный сайт ( или верстку ) с сохранением чистого CSS кода то неизбежно нужно будет создавать отдельные таблицы стилей для Internet Explorer.
В данной публикации я хочу привести пример организации таблиц CSS для браузера IE.
Данный метод является базовым и указывает любому НЕ IE браузеру использовать определенную таблицу стилей.
Многие читатели блогов и различного рода новостных сайтов замечали, а возможно и не обращали внимания, что комментарии ( возможно новости ) сортируются в убывающем порядке поочередно т.е. самые новые всегда сверху.
Сегодня я хотел бы привести пример, как можно несколько разнообразить вывод каких либо списков.
Данный пример выводит запись попарно добавляя номер записи Н2 элементом – цифрой серого цвета а сам текст выводится с отступом. Данный способ не имеет графических элементов в оформлении и очень “легкий” одновременно с неплохой визуализацией.
Облако тегов становится все более массовым явлением которое одновременно является и веянием моды и важным элементом навигации.
Назначение заключается в том, что для навигации по сайтам с лентой публикаций приписываются произвольные теги, обозначающие суть публикации, а размер названий тегов в облаке указывает на их значимость.
Сегодня я приведу пример оформления облака тэгов внешний вид которого вы можете видеть ниже.
Облако тегов или Туча ярлыков или Облако меток (англ. tag cloud) — визуальное представление списка ярлыков (или категорий). Частота упоминаний, поисков, ссылок в интернете с определенного сайта неких слов, терминов, имен, отображается на специальной странице в виде изображения этих слов в формате гиперссылок. Размер изображения тем больше, чем выше релевантность данного слова (термина, имени). - ru.wikipedia.org
Сегодня я хотел бы рассказать о том, как можно сделать необычную с точки зрения визуализации ссылку с использованием CSS и тэга <span>...</span>.
Тег <SPAN> предназначен для определения встроенных
элементов документа. В отличие от блочных элементов, таких как <TABLE>, <P> или <DIV>, с помощью тега
<SPAN> можно выделить часть информации внутри других
тегов и установить для нее свой стиль. Например, внутри параграфа (тега <P>)
можно изменить цвет и размер первой буквы, если добавить начальный и конечный
тег <SPAN> и определить для него стиль текста. Чтобы
не описывать каждый раз стиль внутри тега, можно выделить стиль во внешнюю таблицу
стилей, а для тега добавить параметр class или
id с именем селектора. - www.htmlbook.ru.
Скажем, у Вас есть URL как этот: www.mastersite.org.ua
Визуально ее можно разделить на блоки примерно так: www.mastersite.org.ua
Тем самым мы подчеркиваем в ссылке необходимое нам слово и акцентируем на нем внимание.
Ниже я привожу пример как можно при помощи CSS стилей сделать эту ссылку.
a span {
color: #971212;
}
Данный код устанавливает свой стиль части текста в нашей ссылки.