Редактор дизайна и CSS

 

 

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

Редактор дизайна можно вызвать клавишей F4 или соответствующей кнопкой в панели управления

Откроется окно редактора, привязанное к левому краю программы

 

 

В верхней части редактор расположены 3 вкладки:

Проект – все настройки на данной вкладке будут применены к общему стилю страниц вашего проекта

Страница – настройки будут активны исключительно на данной странице

Modules – на данной вкладке вы можете выбрать любой модуль из тех что у вас установлены и провести его настройки

 

 

Ниже расположен блок поиска, при помощи которого можно легко найти необходимый вам слой.

Блок выбора нужного элемента выполнен в виде дерева, разделенного на несколько основных разделов, в которых вы можете найти то что вам необходимо настроить. Так например, любое меню будет располагаться в разделе «Меню», а основной контент вашего сайта в «BODY». Выбранный вами элемент в дереве, будет отмечаться пунктирной линией в самом проекте.

 

 

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

Как только вы выбрали нужный вам блок в редакторе дизайна, снизу появится новая панель редактирования, в которой вы можете вносить нужные вам настройки верстки

 



Возле каждой ячейки настроек есть специальная сноска в виде знака вопроса  нажав на которую вы можете посмотреть основную информацию по данному параметру

 

 

После внесения каких-либо изменений, они сразу отобразятся на проекте, но что бы они сохранились необходимо нажать кнопку «Применить»

 

 

 

Редактор CSS – это окно редактирования верстки сайта при помощи специального языка программирования. Вызывается клавишей F3 или через панель управления, кнопкой

 

Окно редактора открывается внизу экрана, и оно может быть активным вместе с редактором дизайна

 

 

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

 

 

Довольно удобно работать с редактором CSS и панелью управления браузера, например, Google Chrome. На любом сайте откройте панель редактирования (клавиша F12 в браузере) и проинспектируйте нужный вам блок. Откроется HTML код блока и его CSS настройки, который прямо в браузере можно и изменить. В последствие ваши правки вы можете скопировать в редактор CSS, в тот стиль, который вы правили.

Основная информация по работе с браузером:

  1. Включение инспектора для выделение нужного объекта
  2. Выбранный объект
  3. HTML код данного объекта
  4. CSS настройки, которые можно редактировать или добавлять новые
  5. Страницы стилей, в которых прописаны эти настройки. Наведя на них, вы можете увидеть их местоположение в проекте. Справа от имени находится номер строки, на которой расположенная данная настройка. По этому номеру вы можете искать параметры в редакторе CSS

 

 

Для подобной работы в браузере, вам даже не обязательно выгружать проект в интернет, достаточно открыть локальную копию вашей страницы при помощи специальной функции на панели управления

 

 

В верхней части редактора CSS расположена панель поиска, отмены последнего действия и сохранения данных

 

Рейтинг: 0
Просмотры: 81
Комментарии: 0

подписаться на рассылку

Я согласен на обработку моих данных

© Компания “Edgestile” 2004-2017 г.

Политика конфинденциальности