Оформление на уебсайта Dreamweaver MX с проект за кодиране Dreamweaver
шаблони
Потребителите, които имат малко опит с проектирането на уебсайтове, могат също да използват различни шаблони в Dreamweaver, които могат да бъдат индивидуално адаптирани без големи усилия. Така че можете да получите добър резултат много бързо. Шаблоните могат да бъдат намерени в началния прозорец под заглавието „Създаване от пример“ или под елемента от менюто „Файл - Нов“. Диалоговият прозорец, който се отваря, показва шаблоните на Dreamweaver под раздела „Общи“, но раздела „Шаблони“ ще скрие сайтовете, които сте създали сами, някои от които може да искате да използвате повторно.
Например, ако изберете категорията "CSS таблици със стилове", ще намерите голям брой такива предварително дефинирани стилове във втората колона, включително пълни предложения за дизайн. В диалоговия прозорец се появяват визуализация и кратко описание на избрания стил. Можете да използвате бутона „Създаване“, за да поемете избрания стил и след това да го редактирате допълнително.
Презентация: Шаблони за оформление на страница
Маси
Всеки, който някога е описвал таблици в HTML, ще се радва, че Dreamweaver може да облекчи тази понякога отнемаща време и склонна към грешки работа, като създаде таблица толкова лесно, колкото в програма за обработка на текст. В допълнение към обичайната си функция като ясно представяне на информация в уеб дизайна, таблиците имат и важна функция за оформление. Когато таблиците се използват като помощно средство за оформление, обикновено се използват така наречените "слепи" таблици, които структурират добре съдържанието на клетката, без да могат да видят рамка на таблица.
Създаването на таблица от Dreamweaver е много лесно. Или изберете символа на таблицата в „Вмъкване на лентата“ над прозореца на документа в раздела „Общи“, или отидете директно към елемента от менюто „Вмъкване на таблица“. Във всеки случай се отваря диалогов прозорец, който много напомня диалозите в текстообработващите програми. Просто определяте броя на редовете и колоните, ширината на таблицата в проценти от ширината на екрана или в пиксели, дебелината на границата в пиксели, запълването на клетката и разстоянието между клетките. Ценителите на HTML имат предвид подходящите тагове, други могат да погледнат в кодовия изглед след вмъкване на таблицата.
В диалоговия прозорец може също да се определи ориентацията на заглавката и да се дефинира етикет на таблица, включително нейното подравняване. След като потвърдите избора с бутона OK, желаната таблица вече е на уебсайта. Фоново изображение, цвят на фона и цвят на рамката също могат да бъдат посочени в свързания инспектор на свойства под прозореца на документа.
Използваната за оформление „слепа таблица“ се получава чрез задаване на дебелина на границата от нула пиксела. Информацията за таблицата също може лесно да бъде променена по-късно с помощта на панела със свойства. Най-лесният начин да правите записи в отделните клетки на таблицата е в изглед на чернова, като вмъквате текстовете или изображенията директно в съответния елемент на таблицата, след като преди това сте поставили курсора.
Както сте свикнали от текстов процесор, редове и колони също могат да се вмъкват или изтриват в съществуващите таблици. За целта маркирате елемента на таблицата, в близост до който искате да вмъкнете колона или ред. Под „Вмъкване - Обекти на таблица“ можете да интегрирате редове над или отдолу и колони вляво или вдясно от него.
Елементите на таблицата също могат лесно да бъдат свързани. Съответните елементи са маркирани с мишката. След това използвате елемента от менюто "Промяна - Таблица" и там опцията "Свързване на клетки". Дори вляво има специален бутон в инспектора на имота.
Тези модификации са възможни и с "слепи маси" без предположения, тъй като невидимата рамка е показана с пунктирани линии в изгледа на дизайна. След като сте създали таблицата според вашите собствени дизайнерски идеи, можете да попълните елементите, както желаете. Винаги е важно да имате контролен изглед с помощта на визуализацията на браузъра, до който можете да стигнете, като кликнете върху „глобуса“ над прозореца на документа. Трябва да използвате всички версии на браузъра, налични на компютъра, за предварителен преглед, за да получите изчерпателен преглед на оформлението на уебсайта. По този начин можете до голяма степен да гарантирате, че възможно най-много интернет потребители виждат уебсайта, както е планирано.
Рамки
Използването на CSS е почти неизбежно за професионално оформление, поне ако планирате уебсайт с няколко уебсайта, което обикновено е така. Всъщност, ако приключихте главата за форматиране на текст, вече сте създали CSS инструкции в Dreamweaver. Не е задължително обаче да забележите това с Dreamweaver, тъй като много се случва във фонов режим.
Можете, разбира се, също така съзнателно да създавате и използвате CSS стилове в Dreamweaver. За да направите това, изберете опцията "CSS стилове" под елемента от менюто "Текст" и след това "Ново". Диалоговият прозорец, който се отваря, очаква да въведете име за новия стил. Сега можете да определите стила като клас, така че да може да се използва за всички тагове. Dreamweaver би искал да знае дали CSS стилът трябва да бъде създаден само за един документ или искате да създадете свой собствен CSS файл, за да можете да го използвате отново по-късно.
След потвърждаване с "OK", отваря се прозорецът за дефиниция на CSS стил. Там можете да направите настройки за категориите шрифт, фон, блок, поле, рамка, списък, позициониране и разширения. Тогава всяка отделна настройка принадлежи към дефиницията на стила и оказва влияние върху уеб страницата, в която ще бъде интегриран новият CSS стил.
Презентация: CSS - дефиниция на стил
Ако искате да присвоите този нов CSS стил на определен елемент или раздел от създавания уебсайт, можете да използвате панела със свойства, който принадлежи към текста или таблицата. Маркирайте текстовия раздел и изберете името на новия CSS стил под Стил в Инспектора на свойствата. Същата процедура се използва, когато се използват таблици със стилове, които вече са налични в Dreamweaver. Ако искате да използвате CSS инструкция на таблица или отделни клетки, маркирате таблицата или части от нея и задавате желания "клас" в съответния инспектор на свойства.
Също така е възможно да се използва или дефинира ID стил. След това всеки елемент на страницата, който носи атрибута ID, се форматира съответно. За да направите това, маркирайте раздел на таблица например и въведете име под „Идентификатор на таблица“ в панела със свойства. След това използвайте опцията "Управление на стилове" в полето "Клас". Отваря се диалогов прозорец, наречен „Редактиране на таблица със стилове“. След натискане на бутона "New", ще видите познатия диалогов прозорец "New CSS Style". Сега решавате опцията "Extended (IDs,
за нас
Разработваме уеб приложения с много страст. Щастливи сме да предадем знанията си. Повече за проект за кодиране