Optimizator Field – блог веб разработчика
CSS вёрстка. Внутренняя оптимизация сайтов. Настройка Wordpress.
CSS вёрстка. Внутренняя оптимизация сайтов. Настройка Wordpress.
Вот и настало время выплеснуть из себя заметку по CSS :)
Что-то из инструментария хочется описать. Упрощаем и делаем свою работу удобнее! Зачем? И ребёнку ясно – возможность в рабочее время иметь законные минутки, чтобы написать в блог или порубиться в КС с коворкерами :)
Сегодня я расскажу о КСС-дэбаге и диагностике :)
В былые времена, когда я ещё верстал таблицами было очень удобно использовать для поиска глюков вёрстки:
<table border="1">....</table>
Сейчас же, верстая дивами я использую CSS стили для нужных блоков. Мало ли, какой баг закрался и без FireBugWebDeveloper не узнать почему блоки поплыли…а мы ему ррраааззз:
div.bug {background: red;}
…или…
div.bug {border: 1px solid red;}
…и сразу видно что к чему! Правда при вёрстке пиксель-в-пиксель второй метод не советую, т.к меняются размеры блоков.
«Уууууу! Мы это всё знаеееем!», – закричите Вы и будете правы. Поэтому я приведу ещё пару интересных решений:
Eric Meyer . Цель правил визуально показывать ошибки на странице. Например если у ссылки не проставлен адрес она выделяется определенным цветом и сразу обращает на себя внимание.
Почитайте на перевод статьи.
И ещё:
Есть картинка, размером 1200х800 пикселей, на которой расчерчена каркасная решетка разметки квадратами со стороной 50 пикселей. Картинка вставляется как фоновое изображение в body и упрощает визуальное размещение блоков во время верстки.
Забираем «тулзу» с
Комментарии закрыты.
Последние комментарии