Gastarbayteroff.NET

Самый лучший портал, где вы найдете: уникальные psd шаблоны, joomla, dle, компоненты, модули, боты, плагины, верстка, программы, фото, картинки, клипарты, вектор, гифы, скины и многое другое совершенно бесплатно!

Вступление

В этой статье мы рассмотрим то, как создавать сайты специально под продажу линков (ссылок) на одной из популярных бирж – .ru. Далее будем использовать термин «-сайты», т.е. made for .

Сразу оговоримся, что моральную сторону вопроса мы обсуждать не будем, пусть каждый решает сам, стоит ли ему связываться с этим.

Давно уже ни для кого не секрет, что покупные ссылки на сегодня – основной способ продвижения сайтов. [Далее]

Google Bookmarks Digg Reddit del.icio.us Ma.gnolia Technorati Slashdot Yahoo My Web News2.ru БобрДобр.ru RUmarkz Ваау! Memori.ru rucity.com МоёМесто.ru Mister Wong

Относительно недавно познакомился с CSS-сеткой Golden Grid. Мне она понравилась небольшим весом и использованием правила «золотого сечения». Golden Grid более простая, чем Blueprint. Я не настаиваю на том, что она более удобная, но для моих задач подходит как нельзя лучше.

Вместо обозначений классов span-1, span-2… используются более интуитивные g160, g320 и т.д. Кроме того, неплохая типографика, подстроенная специально под сетку.

Сетка относительно новая (2009), поэтому не хватает многих важных деталей. Например, psd-шаблона. Решив заполнить столь значимый пробел, я создал такой шаблон, благо много времени это не занимает. Проведены и линейки, и серые прозрачные прямоугольники. Это сделано для того, чтобы сетку можно было ставить поверх основного дизайна.

Скачать (.zip, 20 кб)

Google Bookmarks Digg Reddit del.icio.us Ma.gnolia Technorati Slashdot Yahoo My Web News2.ru БобрДобр.ru RUmarkz Ваау! Memori.ru rucity.com МоёМесто.ru Mister Wong

По ссылке двигать скроллер вправо-влево. Чистый CSS эффект.
Исходник для изучения тут: http://www.romancortes.com/ficheros/css-coke.

Google Bookmarks Digg Reddit del.icio.us Ma.gnolia Technorati Slashdot Yahoo My Web News2.ru БобрДобр.ru RUmarkz Ваау! Memori.ru rucity.com МоёМесто.ru Mister Wong

Существует много способов по верстке колоночных макетов. Уже не один нос разбит в течении холиваров, разожженных по поводу использования тех или иных методов. Казалось бы, что все должно быть предельно ясно и ясно, но все-равно возникает много трудностей. Я хочу и свою лепту вложить во всеобщее благое дело, и потому потратил относительно немного времени на эксперименты, которые привели меня к созданию еще одного метода, в котором есть следующие плюсы и минусы:

Плюсы
  • Есть прижимающийся к полу футер
  • Колонки меню растягиваются по 100% высоте
  • Колонок может быть сколько душе угодно
  • Колонки могут быть как лево- так и правосторонними, а также совмещенными, например 2 справа и 1 слева
  • Ширина как резиновая, так и фиксированная
  • Критический минимум хаков
  • Не используется Javascript
  • Не используются бекграундовые изображения для создания эффекта колонки
  • Никаких таблиц
  • Одинаковый результат в ie5.5, ie6, ie7, ie8, ff3.5, o10, chrome4 (Если у вас не работает в каком-то браузере — отпишитесь, пожалуйста, в комментах. Исправим и приведем к универсальному виду)

Минусы
  • Есть несколько «лишних» блоков. (Я бы и сам рад от них избавиться)
  • Есть несколько абсолютно-позиционируемых блоков
Google Bookmarks Digg Reddit del.icio.us Ma.gnolia Technorati Slashdot Yahoo My Web News2.ru БобрДобр.ru RUmarkz Ваау! Memori.ru rucity.com МоёМесто.ru Mister Wong

Вольно-сокращенный перевод статьи 15 Time Saving CSS Tools You Should Be Aware Of
Под катом текст, графика, ссылки

Google Bookmarks Digg Reddit del.icio.us Ma.gnolia Technorati Slashdot Yahoo My Web News2.ru БобрДобр.ru RUmarkz Ваау! Memori.ru rucity.com МоёМесто.ru Mister Wong

Opera 10.50 стала поддерживать border-radius и много других интересных вещей, в этой связи встал вопрос — как отличить Opera 10.50 от более ранних версий в CSS?

Например, у меня на сайте скруглённые уголки для «Оперы», начиная с версии 9.50 делаются при помощи SVG, 10.50 вполне могла бы нарисовать их без этого «изыска». Помучался-помучался и придумал несколько CSS-хаков, собственного изобретения.

Google Bookmarks Digg Reddit del.icio.us Ma.gnolia Technorati Slashdot Yahoo My Web News2.ru БобрДобр.ru RUmarkz Ваау! Memori.ru rucity.com МоёМесто.ru Mister Wong

С поддержкой CSS3, браузером Оперой, всегда было не особо густо.

Но сегодня, в пре-альфе версии 10.5, Опера анонсирует поддержку интересных и давно ожидаемых фич CSS3, в частности это — CSS3 Transitions и 2D Transform. Правда пока, это еще далеко не рабочее решение, и поэтому, для того что бы посмотреть как это работает в Опере, используем префикс -o. Подробности по ссылке

Все это стало возможно, не без помощи движка Opera’s Presto 2.5

И наконец-то, долгожданная поддержка CSS3 Backgrounds и Borders. И кстати, Опера первый браузер, который позволяет использовать эти прелести без префиксов -moz или -webkit

Читая новость, дойдя до слова префикс -o, я подумал, блин, еще один префикс, но за это (см. абзац выше) — я готов простить Опере новый префикс и сказать, а ведь не зря, используя CSS3 в своих проектах, я писал еще и просто border-radius (помимо -moz и -webkit)

P.S. Опубликовал этот топик именно в этот блог, так как фанаты Оперы еще явно что-то напишут в блог Оперы.

Google Bookmarks Digg Reddit del.icio.us Ma.gnolia Technorati Slashdot Yahoo My Web News2.ru БобрДобр.ru RUmarkz Ваау! Memori.ru rucity.com МоёМесто.ru Mister Wong

Модуль «CSS3 Selectors» (которому в апреле исполнится десять лет) достиг статуса «Proposed Recommendation».

Модуль «CSS3 Multicolumn Layout» достиг статуса «Candidate Recommendation».

Рабочие черновики модулей «CSS3 Transitions» и «CSS3 2D Transforms» обновлены, статус «Last Call» недалёк уж от них.

Модуль «CSS3 Color» достиг статуса «Candidate Recommendation».

Блог CSS3.info поведывает обо всех этих событиях и приводит гиперссылки, ведущие ко стенограммам заседаний TPAC.

Google Bookmarks Digg Reddit del.icio.us Ma.gnolia Technorati Slashdot Yahoo My Web News2.ru БобрДобр.ru RUmarkz Ваау! Memori.ru rucity.com МоёМесто.ru Mister Wong

Надеюсь, многие прочитали топик «Не используйте @import», если еще не — советую прямо сейчас. К слову, в комментариях можно отыскать еще пару заметок: при использовании import браузер не лезет на сервер с заголовком If-modified-since и не ждет 304. Он полезет если упорно нажать F5 или ctrl+f5., и IE 6 (и вроде IE 7) может загружать только 32 <link> элемента идущих в шапке. Хотя про последний вроде тоже многие знают.

А сегодня я нашел еще одну неприятную особенность использования @import.

При попытке сохранения документа «Полностью», браузеры не подхватывают импортированные стили, и страница отображается без них. IE так вообще ругается, и ничего сохраняет, только если выбрать режим «Веб-архив», да и тогда сайт отображается не всегда корректно. Проверял в IE7/8, FF3, Chrome 3, Opera 10.

Google Bookmarks Digg Reddit del.icio.us Ma.gnolia Technorati Slashdot Yahoo My Web News2.ru БобрДобр.ru RUmarkz Ваау! Memori.ru rucity.com МоёМесто.ru Mister Wong

Да, это не опечатка! Внезапно обнаружил, что конструкция:

.myclass {behavior:expression((function(){})(this))}

читается WebKit (Chrome, Safari) браузерами и стили после ней браузер не воспринимает и, соответственно, не применяет. Опытным путём было установлено, что проблема в этой конструкции в символах "{" и "}", которые в сумме вызывают какие-то метаморфозы в браузерах. Причём если убрать "{", то баг исчезает, а если "}", то остаётся. Естественно, наличие ";" в конце правила, тип селектора (т.е даже если это будет селектор для ИЕ, вроде * [selector]), тип правила (например предварение правила "//" или "_") ситуации НЕ исправляют, иначе было бы не так уж и страшно!

Особенно знание этого бага полезно людям, любящим объединять все стили в один файл, не вынося стили для IE в отдельный файл, вместо этого используя star-hack и иже с ним! В любом случае если вы относитесь к тем, кто не выносит стили для Internet Explorer'a в отдельный файл, то пишите хотя бы expression'ы в конце файла, иначе долго будете искать причину проблем!

Google Bookmarks Digg Reddit del.icio.us Ma.gnolia Technorati Slashdot Yahoo My Web News2.ru БобрДобр.ru RUmarkz Ваау! Memori.ru rucity.com МоёМесто.ru Mister Wong