У дома картофи Визуален уеб редактор. Основи на уеб дизайна §28. Въведение в уеб дизайна. Какво е уеб страница

Визуален уеб редактор. Основи на уеб дизайна §28. Въведение в уеб дизайна. Какво е уеб страница

Всеки уеб дизайнер и кодер се нуждае от добър редактор на уеб страници, за да създава и редактира HTML, CSS и JavaScript код. Notepad (Windows) и TextEdit (Mac) са страхотни инструменти за начало, но когато придобиете опит, ще искате да използвате по-солиден и удобен инструмент.

Има стотици страхотни редактори, от които да избирате, но много от тях са платени. А ако не искате да нарушавате авторските права, но бюджетът няма средства за закупуване на търговски продукт? Тази статия обхваща няколко отлични безплатни редактора.

  • WYSIWYG редактори.то графичен редактор, които ви позволяват да изграждате оформлението на страницата и да задавате стилове визуално, както в добре познатия текстов процесор MS Word. Те са удобен инструмент за изграждане на дизайн на страници, въпреки че както всеки опитен уеб дизайнер знае, кодът все още трябва да бъде „сресан“, за да се постигне страхотен резултат.
  • Текстови редактори.Това е инструмент за директно редактиране на HTML и CSS код. Някои редактори са с общо предназначение и нямат специални опции за поддръжка на уеб код. Други са специализирани за използване на уеб езици като HTML, CSS, JavaScript и PHP и имат вградени свойства за бързо въвеждане на HTML тагове, CSS свойства и т.н. Много от тези редактори ви позволяват да преглеждате уеб страница в отделен прозорец.

Compozer (Windows, Mac, Linux)

KompoZer е чудесен избор, ако имате нужда визуален редакторпри ограничен бюджет

Komodo Edit е добър редактор, лесен за научаване, но мощен и разширяем

Въпреки че е редактор с общо предназначение, той поддържа HTML и CSS и има контекстно автоматично довършване на HTML тагове и CSS свойства, както и колекция от вградени кодове за различни HTML елементи. За да извлечете максимума от използването на Komodo, трябва да инсталирате разширението HTML Toolkit, което съдържа такива прекрасни функции като автоматично затварящи маркери, предварителен преглед CSS изглед и временен текстов генератор.

Komodo Edit ви позволява да преглеждате редактируеми страници във всяка инсталиран браузър, или използвайте вградения браузър в отделен прозорец, за да можете да редактирате и да виждате резултата от промените едновременно.

Редакторът има вградена функция за качване на файлове в сайта (FTP, FTPS, SFTP или SCP), а също така можете да групирате вашите файлове по забавен начин, като използвате опцията за мениджър на проекти.

Много полезна функция Код > Изберете Блокиране. Той подчертава текущия основен блок на HTML, като например текущия затворен елемент div или ul. Много удобна функция, когато трябва да изберете цял раздел на страница, за да копирате или преместите.

Komodo Edit има много мощни и полезни функции, като използване на регулярни изрази за търсене/замяна, възможност за изпълнение на външни команди и т.н. За щастие, редакторът има и добра помощна система, която улеснява овладяването на силата на Komodo Edit.

Aptana Studio (Windows, Mac, Linux)

Aptana Studio е цялостна интегрирана среда за разработка на уеб приложения с широка гама от плъгини. Въпреки че можете да го използвате само като HTML/CSS/JavaScript редактор на код

Notepad++ е чудесен заместител на Notepad от Windows. Въпреки че няма същия набор от опции като другите редактори, той е чудесен за редактиране на HTML, CSS, JavaScript и други кодови файлове.

PSPad е друг редактор с общо предназначение за Windows с голям набор от функции, полезни за HTML и CSS кодери

jEdit е междуплатформен текстов редактор с мощни макрокоманди и функции на плъгини. Инсталирайте приставката XML, ако трябва да редактирате уеб страници

TextWrangler е лек редактор с общо предназначение. Въпреки липсата на специални функции за уеб разработка, той може да се използва за работа с уеб страници.

Vim определено е труден за научаване, но след като го преминете, никога няма да искате да се върнете!

Дядото на текстовите редактори за програмисти Vim (пряк потомък на редактора vi) е конзолен текстов редактор с отворен код. Той е инсталиран като редактор по подразбиране на почти всички разновидности на Unix, включително Linux и Mac OS X. Редактор е наличен и за използване в Windows и много други системи.

Vim не е система, която можете да инсталирате и започнете да използвате веднага, без никога преди да сте се занимавали с нея. Повечето команди за редактиране включват странни комбинации като :wq и /. Освен това има три режима на редактиране: режим вложки, в който се въвежда текст; визуаленрежим за подчертаване на текст; и командарежим за въвеждане на команди. Тази функционалност е наследство от Unix от дните, когато нямаше прозорци или мишки.

Защо е в списъка? Ако го овладеете, тогава ще се убедите в неговата скорост и сила. С няколко команди можете да направите за няколко секунди това, което може да отнеме минути в други редактори.

Има голям брой макроси и плъгини на Vim, които улесняват работата с HTML, CSS и JavaScript код, включително подчертаване на синтаксиса, автоматично довършване, HTML Tidy и сърфиране в браузър. Тук голям списъкполезни връзки:

  • Автоматично довършване на Vim Omni
  • Редактиране на HTML/XHTML във Vim
  • начална страница

Fraise (Mac)

Fraise е интуитивен редактор за Mac с достатъчно функции за уеб редактиране

Подобно на TextWrangler и gedit, Fraise е прекрасен лек редактор, който е удоволствие да се използва. Това е форк на редактора. Той е сравнително нов и няма подходящ уеб сървър. Понастоящем се поддържа само в Mac OS X 10.6 (Snow Leopard), което означава, че ако използвате версия 10.5, ще трябва да изтеглите Smultron.

Fraise има няколко страхотни опции за уеб редактиране:

  • Маркиране на код за HTML, CSS, JavaScript, PHP и няколко други езика за програмиране.
  • Командата Close Tag(Command-T) за затваряне на текущия маркер. Това наистина спестява време при въвеждане на списъци.
  • Удобен преглед във вградения браузър (с помощта на WebKit), с много удобна опция за актуализиране на живо? който актуализира браузъра веднага щом маркирането и CSS на редактираната страница се промени.
  • Опция за разширено търсене, която поддържа търсене/замяна с помощта на регулярни изрази.
  • Поддръжка на блокове за бързо въвеждане на HTML тагове и CSS свойства.
  • Някои удобни команди за манипулиране на текст, като HTML валидиране и преобразуване на знаци в HTML елементи.

Fraise си струва да разгледате, ако сте на Mac и имате нужда удобен редакторс повече функции от вградения TextEdit.

1 ниво

Упражнение 1

Изберете верният отговор.

Какво означава името World Wide Web?(wwwсвят Широка уеб?

1. Името на глобалната компютърна мрежа.

2. Името на сървъра, където се съхраняват уеб страниците.

3. Набор от правила, които регулират представянето и предаването на информация в Интернет.

4. Името на интернет услугата, участваща в съхранението и предаването на мултимедийни хипертекстови документи.

Задача 2

Изберете верният отговор.

Какво е уеб страница?

1. Документ, съдържащ текст, графики, звук, видео и хипервръзки към други документи, чиято структура е описана в HTML.

2. Всякакви хипер Текстов документ A, който съдържа текст, графики, аудио, видео и хипервръзки.

3. Съхранение на мултимедийна информация

4. Интернет услуга за съхранение и предаване на мултимедийни хипертекстови документи

2 ниво

Задача 3

Изберете верният отговор.

Каква е целта на програмата за браузър?

1. Това универсална програмавлизам информационни ресурсиИнтернет, предимно за разглеждане на хипертекстови документи в световната мрежа.

2. Браузърът ви позволява да работите само с електронна поща.

3. Браузърът сканира само хипертекстови документи, които са уеб страници

Задача 4

Добавете предложение:

Hypertext Document Markup Language се използва за създаване на уебсайтове.

Задача 5

Избройте известни редактори за визуален дизайн.

_____________________________________________________________________________

Задача 6

Какво е името на частта от HTML кода, затворена в ъглови скоби?

__________________________________________________________________________

Задача 7

Вижте текста на HTML документа и отговорете на въпросите:

НО.Какъв цвят фон и текст ще бъдат на уеб страницата?

Б.Когато се показват заглавия на уеб страница, те намаляват или увеличават размера си?

Задача 8

Какво представлява маркерът за параграф?

Задача 9

Как да настроите фона и цвета на цялата страница?

Задача 10

Кой маркер показва изображение на уеб страница?

3 ниво

Задача 11

1. Използвайки материалите за този тест, създайте главната страница на сайта, съдържаща менюто (съдържание). (За да поставите спретнато текстове и графики, по-добре е да използвате таблици).

Снимка 1

4-то ниво

Задача 12

Използвайки материалите за този тест, създайте 5 уеб страници:

Уеб страница "Витяз" (файл vitaz. htm), както е показано на Фигура 2;

Уеб страница "Vistan" (файл vistan.htm)

Уеб страница "VZEP" (файл vzep. htm)

уеб страница "НАФТАН" (файл naftan.htm)

уеб страница "ПОЛИМИР" (файл polimir.htm)

Фигура -2

5-то ниво

Задача 13

Изпратете вашата добра работа в базата от знания е лесно. Използвайте формуляра по-долу

Студенти, специализанти, млади учени, които използват базата от знания в своето обучение и работа, ще ви бъдат много благодарни.

Подобни документи

    Езикът за програмиране HTML: неговите мултимедийни и графични възможности. Изисквания за проектиране и създаване на уеб сайтове. Методически разработки за изучаване на "Уеб дизайн" в училищен курсинформатика и информационни и комуникационни технологии.

    курсова работа, добавена на 09/12/2012

    Анализ на учебно-методическата документация. Методи за проектиране на система от уроци по темата. Характеристика на проектирането на средствата за тематичен контрол. Структурно-логически анализ учебен материал. Разработване на план за теоретично обучение.

    курсова работа, добавена на 21.05.2015

    Психологически особености детско творчество. Връзката между играта и детския дизайн. Различни формиорганизация на обучение, насочено към преодоляване на недостатъците на спонтанното детско проектиране. Специфични характеристики на детския дизайн.

    курсова работа, добавена на 24.06.2011

    Особености на обучението на ученици с увреден слух. Спецификата на обучението на учениците в технологиите за създаване на хипертекст. Разработване на програма за обучение на ученици от 11 клас с увреден слух в технологиите за създаване на уеб страници с помощта на HTML език.

    дисертация, добавена на 25.04.2011г

    Образованието като социокултурен феномен, характеристики на неговите модели. Начини за изграждане и структуриране на съдържанието му. Основните елементи на образованието като бетон образователна институция. Свойства на съвременната образователна система.

    тест, добавен на 25.03.2010

    Интерактивна бяла дъска като мултимедиен инструмент, използването й при преподаване на технически дисциплини в колежа. Методическа разработказанимания по дисциплината „Проектиране и производство на автомобилна техника”. Технология за разработване на урок.

    дисертация, добавена на 13.06.2011г

    Изучаване на историята на изкуството на оригами. Запознаване с учебно-методически препоръки за изпълнение на продукти в техниката на оригами в начално училище. Разглеждане и анализ на процеса на моделиране и проектиране от хартия в начален етап.

    дисертация, добавена на 24.09.2017г

    контролна работа, добавен 16.11.2013г

Когато става въпрос за редактори на код, понякога е трудно да се получи ясен преглед на всички предимства и функционалност, които различните редактори могат да предложат. В крайна сметка обаче е задължително понеедно, така че е важно да знаете кой редактор е най-подходящ за вашите лични нужди.

Редакторите на WYSIWYG често са критикувани от ръчни майстори за раздутия, разхвърлян и несъвместим със стандартите изходен код, който произвеждат. Въпреки това, редакторите на WYSIWYG напоследък станаха много по-добри. Понякога трябва да предоставите на клиентите си най-много прости инструментида редактират или актуализират своите уебсайтове. И тук WYSIWYG редакторите са незаменими.

Би било погрешно да ви препоръчаме някои от "най-добрите" редактори, защото изборът винаги зависи от вашите нужди, основни цели, умения и опит. Затова в тази статия се опитахме да ви дадем преглед на различни, полезни и не толкова WYSIWYG редактори.
Надяваме се, че ще намерите нови редактори, за които никога не сте чували преди. Или може би откриете някои функции, които сте пропуснали в любимия си редактор, или се осмелите да експериментирате с редица обещаващи опции, за да подобрите работния си процес. Освен това можете да разберете кои редактори можете да използвате и кои инструменти не трябва да използвате.

Какво означава WYSIWYG?

В такива редактори можете да промените не изходния код на вашите документи, а неговото представяне, което (ако е възможно) ще бъде публикувано в окончателния документ. Така че, вместо да пишете блокове код на ръка, вие управлявате дизайна с компоненти с помощта на прозореца на редактора. Това означава, че виждате нещо много подобно на крайния резултат, въпреки че документът или изображението все още се създават.

Забележка: Тази статия разглежда само WYSIWYG редактори, базирани на настолни компютри, които работят на Windows, Linux или Mac, и не разглежда JavaScript WYSIWIG редактори.

Adobe Dreamweaver

Преди това продукт на Macromedia, Dreamweaver е един от най-широко използваните редактори, които могат да помогнат на разработчиците да подобрят работния си процес и да спестят много време при кодиране. Ако предишни версииТогава Dreamweaver понякога генерираше изискан изходен код последна версияможе да генерира (в повечето случаи) идеално чисто маркиране.

Dreamweaver също така предоставя различни полезни инструменти като библиотеки с кодови фрагменти, управление на ftp, сървър за отстраняване на грешки и интегрирано кодиране. Например, можете да преглеждате информация за CSS в един, унифициран CSS панел, което улеснява виждането на стилове, приложени към конкретни елементи, определяне къде са дефинирани атрибутите и редактиране на съществуващи стилове. Вижте също нашия списък с уроци за Dreamweaver. Цена: $400 (версия CS3).

Някои от многото функции на Dreamweaver:
* Разширено редактиране на CSS
* Интегрирана среда за кодиране
* Spry рамка за Ajax
* Проверете съвместимостта на браузъра.
* Интеграция с Photoshop CS3 и Fireworks.
* Кодови фрагменти (като CSS формати)
* FTP управление
* Поддръжка на XML
* Поддръжка на FLV
* Учебни ресурси (напр. Adobe CSS Advisor)
* Многобройни разширения за Dreamweaver.

Амая

Основната цел на Adobe Contribute е да даде възможност за редактиране на уебсайтове и блогове за потребители без никакви технически познания. Contribute CS3 позволява на авторите да актуализират съществуващи сайтове и блогове, като същевременно поддържат целостта на сайта. Contribute предлага интеграция с Dreamweaver, позволява ви да публикувате съдържание с Microsoft Officeи редактиране от IE 7 и Firefox.
С този WYSIWYG редактор авторите могат да редактират или актуализират всеки уебсайт или блог, без да се налага да учат HTML. Цена: $169 (версия CS3).

Adobe Live

През април Adobe спря да разработва и продава GoLive 9. Adobe GoLive насърчава потребителите да преминат към Dreamweaver, след което вероятно не трябва да препоръчвате GoLive (всъщност изненадващо мощен инструмент за редактиране, (вижте по-долу) за вашите клиенти.

Някои функции на Adobe GoLive 9:
* Дизайнерски стилове
* Визуално CSS оформление
* Команда за поставяне
*Интеграция на Adobe InDesign®
* Управление на цветовете
*Поддръжка на платформата
* Инструменти за управление на сайта
* Сървър за публикуване
* Интелигентни обекти

Microsoft Expression Web

По едно време силно критикуван за наистина лошия си уеб редактор (Frontpage), Microsoft наскоро създаде редактор Expression, който изглежда наследява много от своите предшественици. Expression се опита да създаде комфортна средаза интернет потребители, с функции, които са изключително подобни на Adobe Dreamweaver. Въпреки това, в пряко сравнение, Dreamweaver предлага повече и произвежда по-чист код. Въпреки това Expression произвежда приличен, съвместим със стандартите код и знае как да работи с CSS и CSS оформления.

Студийно издание с други софтуерни приложения(инструмент за графичен дизайн, инструмент за кодиране на видео и др.) струва прибл. $500. Един лиценз за Expression струва $350. Можете да получите Expression, като надстроите Frontpage и спестите пари. Пробната версия за 60 дни е безплатна за изтегляне, но е необходима регистрация.

Моля, обърнете внимание: Expression не е наследник на Frontpage, те са по-скоро различни инструменти за разработка. Microsoft Expression е по-подобен на Microsoft SharePoint Designer, той е по-скоро дизайнер, фокусиран и насочен към предоставяне на обща уеб разработка. Microsoft SharePoint Designer се фокусира върху разработването и адаптирането към сайтове, базирани на SharePoint, може да се счита за големия брат на Frontpage.

Някои функции на Microsoft Expression:
* Интеграция с ASP.NET 2.0
* Разширено CSS изобразяване
* XPath Expression Builder
* Изграждане и форматиране на изгледи на стандартни за индустрията XML данни
* Решетка за свойства на маркера
* Проверка на достъпността
* Проверка на стандартите в реално време
*Пълна поддръжка на схема

Някои от функциите на NVU:
* Site Manager ви позволява да преглеждате създадените от вас сайтове.
* Поддръжка на XML.
* Вграден валидатор.

Композитор

Той е наследник на Microsofts Frontpage. SharePoint Designer е стандартен WYSIWYG редактор. Освен поддържането на интерактивни ASP.NET страници, той не предлага нищо революционно. Налична е безплатна пробна версия. Има онлайн версия, която изисква Internet Explorerи голямо търпение.

Някои от функциите на Sharepoint:
* поддръжка за интерактивни ASP.NET страници
* създаване на изгледи на данни от RSS, XML, Office XML
* си сътрудничи с вградения Workflow Designer
* CSS инструменти
* проследяване на персонализирани страници
* проверка на правописа
* Интеграция на SharePoint Server 2007

ОСНОВИ НА УЕБ ДИЗАЙНА

§ 1. Въведение в уеб дизайна

1.1 Инструменти и техники за разработка на уебсайтове

Накратко за основното:

    Има две основни групи методи и съответни инструменти за разработване на уебсайтове: визуалени наръчник. Ръчните (софтуерни) методи за уеб дизайн изискват познаване на HTML езика за маркиране. Визуалните методи ви позволяват да вършите цялата работа по създаването на уеб страници с висока степенавтоматизация и не изискват познаване на HTML езика за маркиране.Намаляват сложността и времето за разработка на сайта.

    При създаване на уебсайтове могат да се използват специални инструменти – редактори за визуален дизайн. Например: Microsoft FrontPage, Adobe (Macromedia) Dreamweaver, NamoWebEditor и др. С помощта на такива редактори уеб страниците се създават интерактивно, а съответните HTML код, което е набор от команди на HTML език за маркиране.

    Статични страницисе показват от браузъра на потребителя във вида, в който са създадени и поставени на уеб сървъра. Динамични страницисе генерират по желание на потребителя - информацията се зарежда върху тях от сървърни програми от бази данни.

1.2 Дизайн на уебсайт

    Има следните основни етапи на разработка на уебсайт:

    • определяне на предмета на сайта, неговите цели и задачи;

      проектиране на структурата на сайта, дефиниране на секции и връзки между страници;

      разработка на уеб сайт, т.е. стил на страницата;

      подготовка на материали (текстове и графики) за поставяне на уеб страници;

      проектиране на страници на сайта (създаване на HTML код);

      поставяне в мрежата (публикуване) и тестване на сайта.

    Стилът на дизайн на уеб страница е комбинация от свойства на елементите на уеб страницата: текстов стил (набор от параметри на формата на символи и абзаци) и стил на графичен елемент (набор от параметри на формата).

Упражнение

Създайте проект за уебсайт на една от темите: Моето семейство. Моето училище. Моите приятели. Любимите ми занимания. Моята родина е Беларус. природата родна земя. Интересни професии.

Технология на разработка:

При разработването на уеб сайт ще се придържаме към етапите на разработка на уебсайт.

    Да вземем първата от предложените теми: Моето семейство.

Цел: Разкажете за семейството си.

Задачи: разкажете за всеки член на семейството (име, възраст, професия, предпочитания).

    За по-голяма яснота ще изобразим структурата на сайта под формата на двустепенна схема (фиг. 1.2.1). На първо ниво ще поставим името на уебсайта, снимка на всеки член на семейството и хипервръзки.

На второ ниво на схемата ще изобразим уеб страници, посветени на всеки член на семейството с информация за всеки от тях (фиг. 1.2.2).

ориз. 1.2.2

    Ние ще проектираме сайта. Основен конструктивни елементидизайн на страница (текстови блокове) и графични обекти (чертежи-лога за начална страница, снимки на членове на семейството, "тапет" (фонови изображения), текстови хипервръзки). За поставяне на елементи на дадените места на страницата ще използваме таблици (фиг. 1.1 и фиг. 1.2).

Разработването на проекти за уебсайтове по други теми може да се извърши по схемата, посочена по-горе.

§ 2. Използване на офис приложения за създаване на уеб страници

2.1 Създаване на уеб страници в MS Word

Накратко за основното:

Упражнение

Създайте фрагмент от сайта на една от темите: Моята родина е Беларус. Моето училище. Моите приятели. Любимите ми занимания. Моето семейство (пример за главната страница е представен на извадката). Като хипервръзки използвайте снимки от колекцията от клипове.

проба

  1. команда стартиране Файл - Създаване;

    Избери предмет Уеб страница;

    команда стартиране Формат - Тема;

    изберете тема Слоеве.

Въведете текст и изображения, както е показано на фиг. 2.1.1:

ориз. 2.1.1

      за да вмъкнете снимки от колекцията от клипове, използвайте командата Вмъкване - Чертеж - Картини;

      форматиране на размера на изображението с команда ФорматиранеСнимка…- раздел Размерът(фиг. 2.1.2).

ориз. 2.1.2

    Създайте уеб страници от второ ниво mama.mht, papa.mht, iam.mht:

    1. команда стартиране Файл - Създаване;

      Избери предмет Уеб страница;

      команда стартиране Формат - Тема;

      изберете тема кипарис.

      попълнете уеб страницата с информация (пример: фиг. 2.1.3);

ориз. 2.1.3

      подобно на параграфи. 4a)-4f) създаване на уеб страници papa.mht и iam.mht.

    На главната уеб страница на файла family.mht направете хипервръзки към съответните уеб страници:

    1. изберете снимка (текст) - Вмъкване - Хипервръзка…;

      в полето Папкаизберете подходящия файл (mama.mht);

      ако е необходимо, променете текста на подсказката или въведете текст;

      повторете стъпките въз основа на параграфи 5а) -5г), за останалите хипервръзки.

    Презентациите по темите, посочени в упражнението, трябва да се изпълняват подобно на параграфите. 1-6.

2.2 Запазване на PowerPoint презентации като уеб страници

Накратко за основното:

    Можете да запишете презентация на PowerPoint като уеб страница, като направите следното: изберете менюто Файл- Изберете предмет Запазване като уеб страница- в прозореца Запазване на документ Уеб страница (*.htm, *. html) – въведете име на файл – натиснете бутона Запазете.

    Настройките на уеб страницата могат да бъдат конфигурирани в прозореца Публикуване на уеб страницас натискане на бутон Публикувайте. В този прозорец можете да изберете обектите за публикуване ( Пълно представянеили Слайдове), поддръжка на браузъра, променете заглавката на таблицата.

Упражнение

Създайте фрагмент от сайта въз основа на готовата презентация:

а) " Електричество»;

б) „Пространствени фигури“;

в) „Животните от родния край”;

г) "Оптични устройства".

Технология на създаване:

    Отворете предложен от учителя файл с презентация по една от посочените теми.

    Запазете презентацията като уеб страница: Файл- Избери предмет Запазване като уеб страница- в прозореца Запазване на документизберете типа файл, който да бъде запазен Уеб страница (*.htm, *. html) – въведете името на файла (или оставете предишното) – натиснете бутона Запазете.

    Променете настройките и параметрите на уеб документа, докато запазвате презентацията: щракнете върху бутона Публикувайте(фиг. 2.2.1)

ориз. 2.2.1

    Персонализирайте цветови ефекти: в прозореца Публикуване на уеб страницаНатисни бутона Уеб опции(фиг. 2.2.2) - табл Общ -избирам цветова схемаЦветове за презентация(фиг. 2.2.3) - ако има хипервръзки в презентацията, премахнете отметката от квадратчето Добавете лента за преход на слайдДобре - Публикуване.

ориз. 2.2.2

снимка 2.2.3

    Вижте запазен фрагмент от уебсайт в браузър.

§ 3. Основи на HTML езика за маркиране.

3.1 Създаване на HTML документ в редактора на Notepad

Накратко за основното:

    Абзацът се задава от етикета

    Когато се гледат в браузър, параграфите са разделени един от друг с празен ред. За да принудите преход към нова линиябез създаване на абзац се използва несдвоен таг
    .

    Стилът на удебеления шрифт се задава от етикета , курсивните знаци се определят от тага i.

    Цветът на фона на цялата страница се задава от атрибута bgcolor, а цветът на текста от атрибута text.

    Използва се етикет за задаване на шрифта, цвета и размера на знаците. Шрифтът се посочва от атрибута face, чиято стойност е името на шрифта, като Arial. Размерът на символите се задава от атрибута size и може да бъде изразен в произволни единици, които могат да приемат стойности от 1 до 6. Цветът на символите се задава от атрибута color.

Упражнение

Отворете предложения от учителя текстов документ в редактораТетрадка . Проектирайте и го запазете като уеб страница, показана на една от снимките. Използвайте Приложение 2, за да създадете фоновия цвят.

проба 1

Дизайнерска технология:

    Отворете предложения от учителя текстов документ в редактора Тетрадка(фиг. 3.1.1).

ориз. 3.1.1

    Добавяне към документа (фиг. 3.1.2):

    1. тагове за отваряне и затваряне на HTML документ (-);

      тагове за поставяне на сервизна информация, която не се показва на страницата (-);

      тагове с текст за информация, показана в заглавието на прозореца на браузъра (Образец 1);

      тагове за поставяне на информация, показана в браузъра (-

Ново на сайта

>

Най - известен