Архив категории: "PHP, HTML, CSS…"

index111.jpgСтандартный формат блога построен таким образом, что его сообщения (посты) выводятся друг за другом, причем первыми отображаются самые новые, а старые постепенно уходят в архив. Так было в самого начала, но с развитием блоггинга мы могли видеть множество различных вариантов шаблонов wordpress, которые, например, отображают информацию в газетном виде, а сверху демонстрируются так называемые featured (избранные) статьи. Или, например, фото блоги, что практически не содержат текстовой информации, лишь фото, ну и т.п.. Люди понемногу стали отходить от стандартов. И это здорово. Читать полностью »

Категория: PHP, HTML, CSS..., WordPress | Теги:

php-curl.jpgЕсли вы, также как и многие веб-разработчики, часто делитесь каким-либо кодом в своем блоге, существует большая вероятность, что вам придется по вкусу сегодняшний рецепт. Этот кусок кода автоматически заменяет все содержимое между тегами <pre> и </pre> специальными символами HTML.

Просто вставьте следующий код в functions.php темы вашего блога и весь код внутри тегов <pre> и </pre> будет заменён на спецсимволы. Читать полностью »

Категория: PHP, HTML, CSS..., WordPress | Теги: ,

010-1.jpgСегодня мы с вами поговорим о такой замечательной вещи как CSS спрайты.

Почти каждый дизайн для сайта содержит много картинок, это иконки, шапка сайта и различные графические элементы. Когда посетитель заходит на страницу сайта, на подгрузку каждой картинки на сайте уходит по одному http запросу. Каждый http запрос дает определенную нагрузку на пропускной канал вашего хостинг провайдера, также кушая :) определенное количество трафика, в зависимости от веса картинки. Читать полностью »

Категория: PHP, HTML, CSS... | Теги: ,

css-reset.jpgДля чего нужен так называемый CSS reset? CSS reset — это в переводе называется сброс CSS стилей. Необходимо это только для верстальщиков, которые переводят макеты сайтов в HTML код.

Каждый браузер устанавливает свои значения стилей по умолчанию для различных HTML-элементов, нам их и надо сбросить, чтобы сайты отображались одинаково во всех браузерах. Читать полностью »

Категория: PHP, HTML, CSS... | Теги:

006.jpgНесколько дней назад я искал хороший и простой способ сортировки данных в таблице простым нажатием на заголовки таблицы и нашел интересный скрипт от Стюарта Лангриджа (Stuart Langridge) sorttable.js.

Это руководство объясняет, как использовать его в своих проектах:

Шаг 1: вСоздаем новую страницу и вставляем тег со ссылкой на sorttable.js Читать полностью »

Категория: PHP, HTML, CSS... | Теги:

005.jpgНедавно лазил по разным веб дизайнерским сайтам и набрел на Automatic Image Slider — по русски jQuery карусель, которая автоматически прокручивает картинки. Или сам пользователь может нажимать на кнопочки, тем самым просматривая картинки превьюшки, на которых обычно размещают самую важную и новую информацию на сайте.

Вот сейчас мы такую карусель и сделаем. Я покажу вам как она работает и подробно расскажу как воплотить эту карусель к себе на сайт или блог. Читать полностью »

Категория: PHP, HTML, CSS... | Теги: ,

samurai.jpg

Не так давно на одном форуме я наткнулся на тему, где спрашивалось о том, как сделать так чтобы при наведении курсором на картинку (например, фото в портфолио, ага) появлялась эдакая черная полоска с информацией об этой самой картинке (например, данные о авторе, дате съемки и описании). Так вот, просивший даже не знал, по каким ключам искать такое в Гугле, равно как этого не знает большинство. Другой вопрос, что я знаю, как сделать это и без Гугла, поэтому я накрапал небольшую статью-урок.

Способов решения задачи «наведение курсором на картинку = hover» есть 2. Первый из них подразумевает использование исключительно CSS, и соответственно, выглядит немного топорно. Второй сделан на jQuery и переход более плавный. Выбирайте, который вам больше по душе, а мы начнем. Читать полностью »

Категория: PHP, HTML, CSS... | Теги: ,