MIDAV.RU

MIDAV.RU

Учусь делать сайты в свободное время .

Использование Firebug для изменения вида веб страницы .

Просмотров: 1808Комментарии: 0
Сайтостроение

При создании или редактирования шаблона сайта полезно иметь возможность редактировать css код . Для этого очень удобно использовать Firebug . Это очень полезное дополнение к браузеру Firefox . Это очень полезный инструмент вебмастера . Если Вы до этого не использовали Firebug , самое время начать grin

Итак для начала скачаем и установим само дополнение . Оно доступно на странице дополнений Firefox . Устанавливаем это дополнение в браузер . Если все нормально установилось , в браузере , в правом верхнем углу появится значок в виде жучка .

Чтобы открыть окно Firebug нажимаем на значке левой кнопкой мыши , или клавишу F12 . Видим , что окно поделено на две части . В каждой части расположено несколько вкладок . С их назначением разобраться не трудно . Для анализа исходного кода нам нужно будет пользоваться двумя . Это вкладки HTML и стиль . Подробнее на скиншотах .

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

Эксперементировать можно прямо в окошке Firebug , изменяя , добавляя или удаляя стили для элемента . Добившись нужного результата , копируем стили в нужный нам CSS файл . Название которого можно увидеть в правой части .

В общем Firebug очень полезный инструмент для веб разработчика . Для браузера Google Chrome есть немного урезаная версия Firebug lite . Впрочем она тоже достаточно функциональна .

Если Вы пользуетесь браузером Opera , то в нем есть встроеный отладчик кода , очень неплохой кстати .

Надеюсь новичкам эта статья будет полезной . Приятной работы ! smile

Оставьте комментарий!

grin LOL cheese smile wink smirk rolleyes confused surprised big surprise tongue laugh tongue rolleye tongue wink raspberry blank stare long face ohh grrr gulp oh oh downer red face sick shut eye hmmm mad angry zipper kiss shock cool smile cool smirk cool grin cool hmm cool mad cool cheese vampire snake excaim question


Используйте нормальные имена. Ваш комментарий будет опубликован после проверки.

     

  

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

(обязательно)