Для начала разрешите представиться, ибо, возможно, кто-то не знаком со мной и моим творчеством. Кареглазый Демон. Дизайнер-самоучка. Дайровскими оформлениями занимаюсь уже семь лет. Владею сообществом
Original Design, где совместно с другими талантливыми ребятами выкладываю свое творчество и делюсь советами по работе в фотошопе и написанию кодов. В последнее время концентрируюсь на индивидуальных CSS, передающих атмосферу дневника автора. Посмотреть мои работы можно
здесь. А найти готовые уроки
тут.
Наверное, каждый, кто начинает интересоваться CSS, в глубине души надеется, что есть волшебный набор кодов и секретов, который решает любые задачи и дает возможность создавать оформления мечты щелчком пальцев. Но это не так) Вернее, не совсем так.
Существуют трюки и приемы, фишки и уловки, но без знания базы, без понимания основных принципов и желания учиться вы далеко не уедете.
Однако для тех, кому эта тема интересна, кто пытается оформлять дневник самостоятельно и делать его уникальным, мои советы должны задать направление поиска. Я постараюсь давать вам не только готовые решения, но и попытаюсь передать свой ход мыслей при написании кодов.
Обратная связь и ваш отклик очень важны. Поэтому отмечайтесь в голосовании, пишите комментарии, задавайте вопросы и обозначайте интересующие вас темы для подобных постов.
Я не всеведущ, могу чего-либо не уметь и объясняю, как понимаю сам. Но так сложилось, что работа в фотошопе стала моей профессией, а создание дайровских оформлений - постоянным любимым хобби. И если я не знаю ответа на ваш вопрос сейчас, то обязательно постараюсь найти его в будущем. И, скорее всего, найду)
Теперь непосредственно к самим азам и самому началу написания кода.
читать дальше
Еще до сборки макета в фотошопе или прописывания непосредственно кодами, до придумывания образа и стиля вам необходимо знать, чем вы, собственно, располагаете. А именно — изучить структуру.
Когда вы подключаете сервис CSS, у вас в настройках оформления открывается окошко для кодов, а над ним есть Справка по селекторам CSS
смотреть
Представьте себе картонную коробку. Внутри нее коробки поменьше, внутри них еще меньшие. Это дайровский дневник по сути и есть. Если сдвинуть большую коробку, она потянет за собой те, что внутри, если перекрасить ссылки большой коробки, изменения затронут все ее внутренние вложения.
На той же странице со справкой чуть ниже вы найдете ссылки на полезные статьи по теме. Одна из них посвящена элементам дизайна. CSS для @дневников: элементы дизайна
Также есть доработанный список селекторов. Найти его можно здесь. На самом деле он тоже не полный) Энтузиасты просто не успевают заносить в них новые селекторы и не всегда учитывают разницу в кодах для различных страниц дневника, вроде цитатника, черновиков и прочего.
Как быть? На самом деле сейчас почти во все браузеры вшит Firebug. И эта штука очень упростит вашу жизнь, если вы про нее еще не знаете.
Допустим, я хочу поменять оформление для надписи "Редактировать список любимых смайликов". Кликаю по ней правой кнопкой мыши и в выпадающем меню выбираю исследовать элемент.
смотреть
Внизу или сбоку выпадет куча непонятных строчек. Меня интересует та, которая подсветилась. Наводим на нее мышку и видим название селектора.
смотреть
Чтобы его скопировать в буфер обмена, нужно кликнуть по строке правой кнопкой мыши и выбрать Копировать - CSS селектор.
смотреть
То, что скопировалось, нужно отнести в окошко для CSS и далее прописывать для него свойства.
Как это делается, я расскажу в следующий раз) Разумеется, если рубрика будет вам интересна.