Записи с меткой: «css»

Часто у того, кто верстает сайты, возникает ситуация с float-блоками, которые не желают растягивать родительский контейнер и для этого применяется старый, но рабочий метод с добавлением пустого дива со стилем cleat:both. Но в нешве время данный метод уже не актуален да и это лишний элемент на странице - это не очень красиво.

Для себя я нашел очень красивый аналог данного фикса и работает везде, а для IE, который пока не понимает псевдо-класс :after, используется хак со включением hasLayout при помощи свойства zoom, при котором auto-clearing происходит автоматически.
(далее...)

Понадобилось мне сделать так, чтобы на сайте, на странице категории, облако меток(тегов) бы отображало метки только записей из данной категории. Вроде понятно написал . Поискав в сети, набрел на один плагин Category Specific Tag Cloud автор которого Kirill Belyakov. который меня вроде полностью устроил.
(далее...)

Одна строчка в стилях сайта поможет вам и посетителям вашего сайта глядя на ссылку понять, ведёт ли она на страницу этого же сайта или уводит вас на другой. Проще говоря, можно выделить все внешние ссылки на другие сайты другим стилем, отличающимся от обычных внутренних ссылок.

a:hover:not([href*="pion.ru"])[href^="http://"]{color:red!important;}

(далее...)

Для тех кто создает свои темы для сайтов на движке WordPress, либо модернизирует уже существующие темы, то вполне возможно со временем появится вопрос - Как же определить действительно главную страницу? Вроде все просто, достаточно написать:

if (is_home()){
 echo "Выводим все что хотим!";
}

но увы, наш текст будет выводиться не только на главной странице, но и на страницах типа пейджинга, типа page/2 и т.д., а это не есть гуд и нас это не устраивает, т.к. нам надо только на одной главной странице вывести скажем большой баннер. Вот для этого то, нам и поможет следующий код:
(далее...)

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

Вот было свободное время и я решил перевести статью "Take Your Design To The Next Level With CSS3" и причин тому несколько. Во первых я постоянно работаю с CSS и HTML и мне это интересно, во вторых все новости в этой области меня очень интересуют, а чтобы они лучше усвоились, достаточно один раз просто переписать, а ели еще при этом и переводить, то они отложатся на долго. Ну и в третьих я просто уверен, что это пригодится еще кому-нибудь. Есть и в четвертых и в пятых, но это уже не важно.

Если где накосячил, или просто нашли ошибку, прошу не поленитесь и отпишитесь в комментариях.
(далее...)

Наткнулся тут у Dimox-а на очень приятную и полезную его поделку под названием CSS Layout Generator и не смог пропустить. Сам постоянно верстаю сайты и знаю как порой бывает сложно накодить такой код, который бы правильно отображался во "всех" браузерах и разрешениях. Данный сервис позволяет в пару кликов сгенерить код для почти любого сайта, который точно будет работать как надо.


Вот что пишет сам разработчик:

Сервис может пригодиться тем, кто знает некоторые основы работы с технологиями HTML и CSS, но создание костяка страницы в виде блочной (дивовой) верстки (т.е. структуры, включающей “шапку”, колонку с контентом, боковые колонки (сайдбары) и “подвал”) вызывает у него определенные трудности.

Не стану скрывать, что в первую очередь этот сервис создавался для самого Антона =) Но почему бы не выложить в открытый доступ инструмент, который потенциально может пригодиться кому-то еще? Так и поступили.

Доступны, конечно, не все возможные варианты базовой разметки (к примеру, отсутствуют варианты с резиновой шириной сайдбаров), мы включили, на наш взгляд, наиболее часто используемые. Получилось порядка 3-х десятков вариантов.

Попробовать “CSS Layout Generator” в действии.