Здравствуйте. Статья будет предельно краткой о дополнение для браузера Mozilla Firefox..
Итак данная статья только для обладателей Mozilla Firefox. (на 4.0.1 проверено)
автором помимо Лисы заявлен и Chrome - не пробовал не знаю
итак что нам нужно чтобы очень быстро найти практически любой объект на странице в коде, по его классу:

сам браузер

и дополнение к нему:
Web developer

все эти дела устанавливаем. Сверху в Мозилле появляется Панель Web Developer. Идем в нее по адресу: Инфо и ставим галочку показать ID и Класс. После этого на страничке на объектах появляются ярлычки.

к примеру главная страница сего сайта будет выглядеть вот так - скрин

Мы смотрим на ярлычок интересующего нас объекта, копируем его ID или класс, далее идем в админку: Стили и шаблоны - Поиск в шаблонах, и там вводим название, которые мы скопировали с объекта, и по нему пытаемся найти объект.
Будьте внимательны при изменения класса, так как один и тот же класс может присваиваться ко многим объектам и изменяя его, вы соответственно изменяете, множество объектов (к примеру класс smallfont).
В принципе можно даже не заходить в поиск по шаблонам, а пойти сразу в Стили и шаблоны - Управление стилями - Все опции стиля - найти на странице (ctrl+F) Дополнительные определения CSS и во вторую колонку сверху вписать:

.ваш_класс {
всевозможные_параметры
}

ну к примеру красивый префикс:

.prfx {background: #009DFF;
font-size: 0.8em;
font-weight: bold;
border: 1px solid #000000;
text-shadow: 1px 1px 0 rgba(0,0,0,.5);
box-shadow: 0 0 3px rgba(0,0,0,.5);
-moz-box-shadow: 0 0 3px rgba(0,0,0,.5);
-webkit-box-shadow: 0 0 3px rgba(0,0,0,.5);
padding: 2px;
margin: 4px 0 0;
-webkit-border-radius: 5px;
-moz-border-radius: 5px;
border-radius: 5px;
color: #FFFFFF;
}

О других возможностях Web Developer:

Расширение Firefox WebDeveloper

YouTube.com 00:05:30

Успеха!

Originally Posted by busyava

Статья будет предельно краткой, но польза от нее..

польза от неё будет на пару порядков больше, если всё это будет проиллюстрировано скринами

как там было, у классика...

Алисе наскучило сидеть с сестрой без дела на берегу реки; разок-другой она заглянула в книжку, которую читала сестра, но там не было ни картинок, ни разговоров.
-- Что толку в книжке, -- подумала Алиса, -- если в ней нет ни картинок, ни разговоров?

Я что-то аналогичное писал
http://vbsupport.ru/forum/showthread...127#post390127
только с другим дополнением.

Originally Posted by Sven

Я что-то аналогичное писал
http://vbsupport.ru/forum/showthread...127#post390127
только с другим дополнением.

нене firebug стоит тоже в принципе и им можно найти, но посмотрите на скрин и поймете насколько Web Developer удобнее, и насколько уменьшаются шансы задеть CSS стилем штатные классы воблы, так как на скрине сразу видно повторяющиеся классы

Не, такое не по мне, чтоб весь стиль разукрашивал + стиль "едет" прилично

Я сразу выделяю проблемную область и смотрю где она находится.
За статью +

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

Originally Posted by busyava

Сейчас скопипастю от куда нибудь список, того что умеет дополнение

И скринов добавь, как у меня в статье, чтоб наглядней было.

mission complete

busyava добавил 04.06.2012 в 18:12

Originally Posted by Sven

Я сразу выделяю проблемную область и смотрю где она находится.

на панели - ошибок CSS нет - Посмотреть стиль элемента (либо Ctrl + Shift + Y)

А на мой взгляд firebug вполне хватает с головой.
По правому клику "Inspect element with Firebug" и ты переходишь на html код и в правой части тебе выводится весь компелированный стиль и все родители, плюс есть возможность увидеть макет в целом.
Ну и очень полезным для отслеживания ajax это стоп точки в скриптах...
В общем не знаю, но по мне как то Web developer или уж сильно навернут или чего то в нем не хватает, или как то уж больно все сложно и много менюшек.... Но 3 раза его устанавливал и 3 раза его сносил... Остановился на firebug. Ntv более,. что к нему есть еще и расширения функциональности, впрочем которые я не ставил.