Лабораторная работа №1 Знакомство с Web. Первая html-страница icon

Лабораторная работа №1 Знакомство с Web. Первая html-страница


Скачать 42.81 Kb.
НазваниеЛабораторная работа №1 Знакомство с Web. Первая html-страница
Размер42.81 Kb.
ТипЛабораторная работа

Лабораторная работа №1

Знакомство с Web. Первая HTML-страница

Цель работы: Изучить основы языка HTML. Создание HTML - страницы с использованием материала прочитанных лекций.

Теоретическая часть:

Базовые сведения:

Немного истории. Всемирная информационная сеть (World Wide Web далее Web) имеет недолгую, по людским меркам, историю. Годом рождения Web считается 1992 год, а отцом основателем был некто Tim Berners-Lee, который сумел, используя новые сетевые технологии и опыт своих предшественников, сделать Web приятным и удобным средством распространения информации во всемирной сети компьютерных сетей Internet (Internet существует с середины 60-х годов).

Толчок для своего стремительного и победного шествия по планете Web получила в 1993 году, когда Mark Andressen с группой студентов университета Иллинойса, разработали бесплатно распространяемую (вот истинная причина бурного развития Web) программу Mosaic для просмотра Web-страниц.

HTML был разработан на основе мощного языка разметки SGML, путем переноса некоторых его функций разметки данных в сетевую среду для разметки гипертекста. Одновременно с развитием Web технологий, насыщением Web новыми сервисами и возможностями, развивался и язык разметки гипертекста. С момента своего появле-ния стандарт HTML претерпел множество изменений, последнее из которых это спецификация HTML 4.01, анонсированная консорциумом W3C 24 декабря 1999 г. (есть ссылки на спецификацию 5.5 май 2007 года)

Суть и составные части Web технологии.

Выделим базовые элементы технологии Web:

  • Internet это всемирная сеть разнородных компьютерных сетей, взаимодейст-вующих по протоколу TCP/IP.

  • Web является одним из приложений Internet (наряду с электронной почтой, но-востями и прочими электронными сервисами), предназначенным для массового распространения разнообразной информации.

  • Носителями информации в Web служит Web-страницы, содержащие текст, графику, мультимедиа элементы и гиперссылки на другие ресурсы Web или Internet.

  • Для передачи гипертекста Web-страниц в Internet используется специально разработанный протокол HTTP (Hyper Text Transfer Protocol).

  • Для разработки Web-страниц используется специальный язык разметки гипертекста HTML (Hyper Text Markup Language).

  • Для просмотра Web-страниц используется специальная клиентская программа Web-браузер. В окне Web-браузера отображаются результаты интерпретации языка HTML с Web-страниц, полученных во время навигации по гиперссылкам.

^ Основы языка разметки гипертекста - HTML.

Базовым элементом языка разметки гипертекста является - ТЕГ (дескриптор, маркер). Тег всегда заключен между скобками < > и имеет следующий вид: <ТЕГ параметр1="ЗНАЧЕНИЕ" ... параметрN=``ЗНАЧЕНИЕ''>

Теги бывают одиночными и контейнерными. Контейнером называется пара: открывающий <ТЕГ> и закрывающий .

<ТЕГ> Содержимое контейнера

Открывающий тег служит для указания программе-браузеру начала какого-либо объекта или задания свойств объектов помещенных в контейнер. Закрывающий тег служит для указания программе-браузеру о конце объекта или окончания применения свойств, заданных в открывающем теге. Параметры(атрибуты) тега задают значения свойств данного объекта или объектов помещенных в контейнер. Значения свойств, содержащие пробелы, берутся в кавычки, в остальных случаях кавычки можно опустить.

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

Документ HTML начинается открывающим тегом и заканчивается закрывающим тегом . Между данной парой контейнерных тегов располагаются две другие основные части HTML документа: заголовок, заключенный в контейнер ... и тело документа в контейнере .... Таким образом, структура простого HTML документа выглядит примерно так:

^ Структура HTML-документа



"внешний" заголовок (титул)

Заголовок документа

Тело документа



Замечание: Язык HTML не чувствителен к регистру. Тэги могут набираться как прописными, так и строчными буквами, т.е. команда      эквивалентна команде   <TITLE>    или   <TiTlE>. Не все тэги поддерживаются всеми браузерами. Если браузер не поддерживает тэг, он его просто игнорирует.</span><br /> <br /> <b>Объявление .</b><br /> <br /> Элемент должен первым указываться в документе HTML (теоретически). Он сообщает серверу WEB способ обработки документа и то, какие дескрипторы могут находиться на странице, хотя чаще всего он игнорируется браузерами. Поэтому его применение строго не обязательно. <br /> <br /> Синтаксис: <br /> <br /> Здесь текст определяет версию HTML , а URL позволяет браузерам пользователей загрузить DTD например:<br /><br /><b>Тэг <HTML>.</b> <br /> <br /> Тэг <HTML> определяет границы документа HTML, ему соответствует конечный тэг </HTML>. Между этими двумя тэгами располагается собственно весь документ. Как и тэги <HTML> и </HTML> - не являются строго обязательными. Но, все-таки, их использование является правилами хорошего тона т.к. браузеры у пользователей могут быть всякие и не известно - насколько корректно они визуализируют такой код. <br /> <br /> <b>Элемент <BODY>.</b><br /> <br /> Элемент <BODY> предназначается для выделения той части документа, которая будет визуализирована для пользователя. Он имеет как начальный, так и конечный теги. Начальный тег <BODY> может иметь несколько атрибутов . <br /> <br /> Вложенные атрибуты элемента <BODY>: <br /> <br /> Элемент BODY может содержать большое количество атрибутов. Все они важны, так как определяют общий облик документа. Эти атрибуты приведены в таблице. <br /> <table width=577 cellpadding=7 cellspacing=1> <col width=174> <col width=370> <tr> <td width=174> <br /><b>Атрибут</b><br /> </td> <td width=370> <br /><b>Назначение</b><br /> </td> </tr> <tr> <td width=174> <br />ALINK<br /> </td> <td width=370> <br />Этот атрибут задает цвет активной гиперссылки, он меняет цвет гиперссылки в момент щелчка по ней мышью, не желательно задавать ему цвет фона по понятным причинам. Синтаксис: <BODY ALINK="цвет"><br /> </td> </tr> <tr> <td width=174> <br />BACKGROUND<br /> </td> <td width=370> <br />указывает на URL - адрес изображения, которое используется в качестве фонового Синтаксис: <BODY BACKGROUND="(URL)(путь) имя файла"><br /> </td> </tr> <tr> <td width=174> <br />BGCOLOR<br /> </td> <td width=370> <br />определяет цвет фона документа Синтаксис: <BODY BGCOLOR="#ff0000"> или <BODY BGCOLOR="RED"><br /> </td> </tr> <tr> <td width=174> <br />BGPROPERTIES<br /> </td> <td width=370> <br />если установлено значение FIXED, фоновое изображение не прокручивается<br /> </td> </tr> <tr> <td width=174> <br />LEFTMARGIN<br /> </td> <td width=370> <br />Устанавливает границу левого поля в пикселах<br /> </td> </tr> <tr> <td width=174> <br />LINK<br /> </td> <td width=370> <br />Определяет цвет еще не просмотренной ссылки Синтаксис: <BODY LINK="цвет"><br /> </td> </tr> <tr> <td width=174> <br />TEXT<br /> </td> <td width=370> <br />Этот атрибут задает используемый по умолчанию цвет текста, который не является гиперссылкой. По умолчанию такой текст будет черным. Синтаксис: <BODY TEXT="цвет"><br /> </td> </tr> <tr> <td width=174> <br />TOPMARGIN<br /> </td> <td width=370> <br />Устанавливает границу верхнего поля в пикселах<br /> </td> </tr> <tr> <td width=174> <br />VLINK<br /> </td> <td width=370> <br />Этот атрибут задает цвет посещенной гиперссылки, не желательно задавать ему цвет фона и цвет атрибута LINK по понятным причинам. Синтаксис: <BODY VLINK="цвет"><br /> </td> </tr> </table> <br /> Определение цвета составных частей документа - первый шаг к его созданию. Если это не сделано, используются цвета по умолчанию. Они определяются установками программы просмотра.<br /> <br /> Не существует каких-либо правил хорошо сбалансированной палитры. Нужно лишь помнить о том, чтобы читатели смогли прочитать текст, не испытывая неудобств, стараться поддерживать высокую контрастность текста и фона и избегать соседства областей с близкими цветами.<br /> <br /> В HTML цвета определяются цифрами в шестнадцатеричном коде. Цветовая система базируется на трех основных цветах - красном, синем и зеленом. Для каждого цвета задается шестнадцатеричное значение в пределах от 00 до FF, что соответствует диапазону 0-255 в десятичном исчислении. Затем эти значения объединяются в одно число, перед которым ставится символ #. Для простоты в HTML 3.2 определены 16 стандартных цветов, которые вместе с их шестнадцатеричными кодами приведены в нижеследующей таблице.<br /> <CENTER> <table width=394 cellpadding=2 cellspacing=1> <col width=208> <col width=173> <tr> <td width=208 height=19> <br /><b>Цвет</b><br /> </td> <td width=173> <br /><b>Код</b><br /> </td> </tr> <tr> <td width=208 height=16 bgcolor="#000000"> <br />Black (черный)<br /> </td> <td width=173 bgcolor="#000000"> <br />#000000<br /> </td> </tr> <tr> <td width=208 height=16 bgcolor="#800000"> <br />Магооп (темно-бордовый)<br /> </td> <td width=173 bgcolor="#800000"> <br />#800000<br /> </td> </tr> <tr> <td width=208 height=15 bgcolor="#008000"> <br />Green (зеленый)<br /> </td> <td width=173 bgcolor="#008000"> <br />#008000<br /> </td> </tr> <tr> <td width=208 height=16 bgcolor="#808000"> <br />Olive {оливковый)<br /> </td> <td width=173 bgcolor="#808000"> <br />#808000<br /> </td> </tr> <tr> <td width=208 height=16 bgcolor="#000080"> <br />Navy (темно-синий)<br /> </td> <td width=173 bgcolor="#000080"> <br />#000080<br /> </td> </tr> <tr> <td width=208 height=16 bgcolor="#800080"> <br />Purple (фиолетовый)<br /> </td> <td width=173 bgcolor="#800080"> <br />#800080<br /> </td> </tr> <tr> <td width=208 height=16 bgcolor="#008080"> <br />Teal (чирок)<br /> </td> <td width=173 bgcolor="#008080"> <br />#008080<br /> </td> </tr> <tr> <td width=208 height=16 bgcolor="#808080"> <br />Gray (серый)<br /> </td> <td width=173 bgcolor="#808080"> <br />#808080<br /> </td> </tr> <tr> <td width=208 height=16 bgcolor="#c0c0c0"> <br />Silver (серебряный)<br /> </td> <td width=173 bgcolor="#c0c0c0"> <br />#С0С0С0<br /> </td> </tr> <tr> <td width=208 height=16 bgcolor="#ff0000"> <br />Red (красный)<br /> </td> <td width=173 bgcolor="#ff0000"> <br />#FF0000<br /> </td> </tr> <tr> <td width=208 height=13 bgcolor="#00ff00"> <br />Lime (известь)<br /> </td> <td width=173 bgcolor="#00ff00"> <br />#00FF00<br /> </td> </tr> <tr> <td width=208 height=16 bgcolor="#ffff00"> <br />Yellow (желтый)<br /> </td> <td width=173 bgcolor="#ffff00"> <br />#FFFF00<br /> </td> </tr> <tr> <td width=208 height=16 bgcolor="#0000ff"> <br />Blue (синий)<br /> </td> <td width=173 bgcolor="#0000ff"> <br />#0000FF<br /> </td> </tr> <tr> <td width=208 height=16 bgcolor="#ff00ff"> <br />Fuchsia (фуксия)<br /> </td> <td width=173 bgcolor="#ff00ff"> <br />#FF00FF<br /> </td> </tr> <tr> <td width=208 height=16 bgcolor="#00ffff"> <br />Aqua (аква]<br /> </td> <td width=173 bgcolor="#00ffff"> <br />#00FFFF<br /> </td> </tr> <tr> <td width=208 height=16 bgcolor="#ffffff"> <br />White (белый)<br /> </td> <td width=173 bgcolor="#ffffff"> <br />#FFFFFF<br /> </td> </tr> </table> </CENTER> <br /><br /><b><span class="butback" onclick="goback(866850)">^</span> <span class="submenu-table" id="866850">Заголовочные тэги.</span></b> <br /> <br /> Элемент <HEAD> </HEAD> определяет заголовок документа. <br /> <br /> <b>TITLE - "внешний" заголовок (титул).</b> <br /> <br /> Используется для задания обязательного "внешнего" заголовка документа. Титул может выводиться в окне заголовка программы просмотра; в списке результатов поиска, возвращаемых поисковым сервером; в горячем списке, определяемом пользователем; списке истории и т.д. <br /> <br /> Основной синтаксис <TITLE>последовательность символов

В TITLE можно использовать escape последовательности, например, < (для <) и ä (для д), но никакие теги HTML не разрешены, поэтому Вы не можете задавать в заголовке размеры шрифтов или выделения.

Примеры A study of population dynamics Примечания: Написать хорошее заглавие - очень важно, так как списки результатов поиска, возвращаемые поисковым сервером, могут использовать его.

Комментарии

Файл HTML может содержать комментарии, дающие пояснения для человека, читающего HTML код. Комментарии не влияют каким-либо образом на представление документа, т.е. они игнорируются браузером. Вы можете начать комментарии с четырехсимвольной последовательности (два дефиса, знак "больше чем"). Например: .

^ Оформление текста

Элемент Элемент используется с целью выделения особым шрифтом слова или текста. Синтаксис: Текст

Элемент Элемент используется с целью дополнительного выделения фрагментов программного кода. По умолчанию он отображается телетайпным шрифтом. Данный элемент предпочтительнее, чем элемент (телетайпный шрифт). Поскольку расположение пробелов существенно для чтения программного кода, элемент целесообразно употреблять в сочетании с элементом
. Синтаксис: листинг кода

Элемент Элемент используется с целью обозначения терминов и определений по типу словарей или глоссариев. Синтаксис: Текст

Элемент Элемент используется с целью обозначения источника информации ,из которого взята цитата. Синтаксис: Текст

Элемент Элемент используется с целью выделения особым шрифтом слова или текста. Синтаксис: ^ Текст

Элемент > Элемент используется с целью выделения курсивным шрифтом слова или текста. Синтаксис: Текст

Элемент Элемент используется с целью выделения полужирным шрифтом слова или текста. Синтаксис: ^ Текст

Элемент > Элемент используется с целью выделения подчеркиванием слова или текста. Синтаксис: Текст

Элемент Элемент используется с целью выделения надстрочных слова или текста. Синтаксис: Текст

Элемент Элемент используется с целью выделения подстрочных слова или текста. Синтаксис: Текст

Элемент Элемент используется с целью выделения крупным шрифтом слова или текста относительно ос-новного текста. Синтаксис: Текст

Элемент Элемент используется с целью выделения мелким шрифтом слова или текста относительно основного текста. Синтаксис: Текст

Элемент Элемент используется с целью изменения выделения шрифтом слова или текста. С ним приме-няются два атрибута size и coloR. Некоторые браузеры поддерживают атрибут face, позволяющий задать любой из перечня шрифтов, если браузер не находит заданный шрифт - то используется шрифт, заданный по умолчанию. Синтаксис: Текст или Текст

Элемент Элемент используется как альтернатива атрибуту size элемента , он позволяет задать базовый размер шрифта во всем документе и не имеет конечного тега. По умолчанию значение его задается равным 3 ,значение size может выражаться так же и относительным размером, например, размер -1 означает размер на один меньший, чем по умолчанию. Синтаксис:

Шесть уровней заголовков Соответствующие каждому уровню гарнитура и размер шрифта зависят от браузера, стилю

на-значается самый большой и самый жирный шрифт, а стилю

назначается самый маленький и са-мый невзрачный шрифт. Элемент может иметь атрибут align, который указывает отступ left, centeR или Right. Синтаксис: Текст заголовка

Разделительные линии
Элемент
используется для проведения горизонтальной черты в документе, он может иметь атри-буты : coloR, задающий цвет линии, size высота в пикселах Width ширина в пикселях или процентах от ширины экрана, align режим выравнивания, и не имеет конечного тега. Синтаксис:


Элемент
Этот элемент задает один из способов разбиения текста на абзацы. Он может иметь вложенный атрибут align, который указывает отступ left, center, right, justify. Каждый следующий абзац игнорирует, заданное для предыдущего абзаца значение align. Синтаксис:
Текст абзаца


Элемент
Этот элемент задает разрыв текста с переходом на новую строку. Он может иметь вложенный атрибут cleaR, который может принимать значения left, all или Right тем самым указывать обтекание текста во-круг плавающих изображений вставленных в текст нестандартным способом. Каждый следующий аб-зац игнорирует, заданное для предыдущего абзаца значение cleaR. Синтаксис:
Текст Может быть отменен тэгами и

Элемент
Весь текст, заключенный в тэги
и
будет визуализирован браузером точно так, как он визуализирован в исходном коде документа, кроме того текст выводится моноширинным шрифтом, что значительно упрощает задачу форматирования текста в колонки. Элемент поддерживается не всеми браузерами, он может иметь атрибут Width, который задает ширину отводимого пространства под текст в символах. Элемент сменил собой устаревшие элементы , <listing> и <br /> Синтаксис: <br />...текст.. .<br /> <br /> <br /> <i><b>Элемент <div></b></i> Элемент <div> позволяет выделить в структуре документа несколько разделов. Он является блочным элементом, функционирующим во многом подобно элементу <br />. Если закрывающий тэг <br /> опущен, то <div> эффективно заменяет его и начинает новый абзац. Он может иметь атрибут align, который указывает отступ left, centeR или Right. Каждый следующий раздел игнорирует, заданное для предыду-щего раздела, значение align. Синтаксис: <div align=отступ> Текст раздела </div> <br /> <br /> <i><b>Элемент <address></b></i> Элемент <address> используется для оформления контактной информации текущего документа, будь то адрес электронной почты или полный почтовый адрес с номером телефона. Синтаксис: < ADDRESS>контактная информация </address> <br /> <br /> <i><b>Элемент <BLOCKQUOTE></b></i> Элемент <BLOCKQUOTE> позволяет выделить обьемный текст-цитату из общего текста. Синтаксис: <BLOCKQUOTE> Текст </BLOCKQUOTE> <br /> <br /> <b><span class="butback" onclick="goback(866854)">^</span> <span class="submenu-table" id="866854">Списки</b> <br /> <br /> <i><b>Элемент <ol></span></b></i> используется с целью задания нумерованных списков, имеет атрибуты type=1, или A, или a, или I, или i для задания вида нумерации и staRt для указания, с какого индекса начинается нумерация списка.<br /> <br /> Элемент <ol> включает в себя дополнительный элемент <li>, который задает элементы списка. Синтаксис: <ol type=1 start=1> <li> элемент списка <li> элемент списка </ol> <br /> <br /> Пример: <br /> <ol> <li><br /> элемент списка <br /> <li><br /> 2. элемент списка <br /> </ol> <br /> <i><b>Элемент <ul></b></i>, по сути, является аналогом <ol> без дополнительных элементов <li>, он используется с целью задания ненумерованых списков, имеет атрибут type=ciRcle,squaRe, или disc для задания вида маркера. Элемент <ul> включает в себя дополнительный элемент <li>, который задает элементы списка. Синтаксис: <ul type=circle> <li> элемент списка <li> элемент списка </ul> <br /> <br /> Пример: <br /> <br /> o элемент списка <br /> <br /> o элемент списка <br /> <br /> <i><b>Элемент <DL></b></i> используется с целью задания словарей, глоссариев и прочих перечней. Элемент <DL> включает в себя дополнительные элементы <DT> и <DD>, которые обозначают соответственно термин и определение. Синтаксис: <DL > <DT> термин 1 <DD>определение 1 <DT> термин 2 <DD>определение 2 </DL> Пример: <br /> <br /> термин 1 определение 1 <br /> <br /> термин 2 определение 2 <br /> <br /> <b><span class="butback" onclick="goback(866855)">^</span> <span class="submenu-table" id="866855">Порядок выполнения лабораторной работы:</span></b><br /> <br /> <i>Создайте собственную страницу (проверяя её вид в окне браузера на каждом этапе проектирования):</i><br /> <ol> <ol> <li><br /> Запустите программу "Блокнот" (notepad.exe). Создайте файл с именем и расширением <Ваша фамилия>.html. <br /> <li><br /> В этом файле напечатайте текст HTML-страницы (в ней обязательно должен присутствовать заголовок и комментарий). HTML-страница должна отображать в окне браузера какую-нибудь строку. Например: <br /> </ol> </ol> <br /><br /><html><br /> <br /> <head> Это мой сайт!!!!<br /> <br /> <title>Моя первая страничка </title><br /> <br /> </head><br /> <br /> <body><br /> <br /> Здравствуйте, это я и моя первая страница. Давайте знакомиться!<br /><br /><br />Добро пожаловать! :)<br /> <br /> </body><br /> <br /> </html><br /> <br /> <img src="2336490_html_m39c2fb95.png" name="graphics1" align=bottom width=623 height=323 border=0><br /> <ol> <ol start=3> <li><br /> Допишите текст страницы так, чтобы получилось два абзаца произвольной тематики. При этом первый абзац должен быть выровнен по центру, а второй - по левому краю. Шрифт первого абзаца должен быть "bold" (жирный), "underline" (подчёркнутый) и на размер больше второго, а шрифт второго абзаца – "italic" (курсив). Задайте разные шрифты для абзацев. <br /> </ol> </ol> <br /> Пример: <br /> <br /> <html><br /> <br /> <head> Это мой сайт!!!<br /> <br /> <title>Моя первая страничка </title><br /> <br /> </head><br /> <br /> <body text="#336699" bgcolor="#000000"><br /> <br /> <center><br /> <br /> Здравствуйте, это я и моя первая страница. Давайте знакомиться!<br /><br /><br />Добро пожаловать! :) </center><br /><br /><br /><b> <u> <br /> <br /> Я совсем недавно начал(а) знакомиться с HTML, и мне сразу же тоже захотелось создать свою домашнюю страничку для моих новых виртуальных друзей и знакомых, чтобы они могли посмотреть мои фотографии, почитать обо мне, черкнуть пару строчек в мою гостевую книгу. А может и просто случайный посетитель вдруг захочет познакомится со мной, и у меня появться еще один виртуальный друг? :)</b></u> <br /><br /><br /><i><span class="butback" onclick="goback(866856)">^</span> <span class="submenu-table" id="866856">Мои увлечения просты! но в двух словах не расскажешь, потому давайте перейдем к следующей страничке</span></i><br /><br /> <br /> </body><br /> <br /> </html><br /> <br /> <img src="2336490_html_72d9590e.png" name="graphics2" align=bottom width=623 height=617 border=0><br /> <ol> <ol start=4> <li><br /> Добавьте в Web-документ после второго абзаца гиперссылку на сайт ХНЭУ (http://www.hneu.edu.ua/ua/news.html). <br /> </ol> </ol> <br /> Примечание: Тэг делает ссылкой заключенную в него картинку или фразу (текст). Принципы прописывания пути здесь такие: <br /> <br /> (1) - мои фотографии<br /> <br /> (2) - мои фотографии<br /> <br /> (3) - <a rel="nofollow" href="http://www.homepage.ru/prf.html">мои фотографии</a> <br /> <br /> В случае (1) документ лежит в той же директории (папке), что и документ, в котором мы ссылаемся на prf.html, в случае (2) документ лежит в поддиректории /photos, в случае (3) мы ссылаемся на сайт http://www.homepage.ru, где лежит нужный нам документ. <br /><br /><br />Есть один фактор, который нам нужно учесть: цвет ссылки нужно прописывать, а иначе по умолчанию он будет просто безобразным, поэтому вспомним об открывающем тэге боди: <br /><br /><br /><body text="#336699" bgcolor="#000000" <span>link="#339999" alink="#339999" vlink="#339999"</span>><br /> <ol> <ol start=5> <li><br /> Измените вид странички следующим образом:<br /> </ol> </ol> <br /> Задайте отличные от установленных по умолчанию цвета: текста, фона и гиперссылок. Задайте отступ для строки от верхнего и левого края окна браузера. Сделайте так, чтобы цвет второго абзаца был отличен от первого.<br /> <ol> <ol start=6> <li><br /> Вставьте между абзацами картинку и обведите её рамкой с толщиной более 1 пиксела. Установите текст второго абзаца справа от картинки на определённом расстоянии.<br /> <li><br /> Добавьте после абзаца с картинкой и до гиперссылки красную нерельефную линию шириной в 2 пиксела и длиной 80% от ширины окна браузера, выровняв её по середине странички.<br /> <li><br /> Просмотрите свою страницу (если это возможно) в двух различных браузерах.<br /> </ol> </ol> <br /><br /><i><b><span>Задание на лабораторную работу</span></b></i> <br /> <br /> Ознакомьтесь с теоретическим материалом и подготовьте свою домашнюю страницу, содержащую информацию о студенте. <br /> <br /> Обязательное содержание: <br /> <ul> <li><br /> Информация о том, чей сайт и фото студента. <br /> <li><br /> Электронный почтовый адрес. <br /> <li><br /> Ссылка на рабочую страницу или сайт вуза студента. <br /> <li><br /> Мой ВУЗ - о ХНЭУ. <br /> <li><br /> Моя группа. <br /> <li><br /> Моя будущая профессия. <br /> <li><br /> Мои увлечения или хобби. <br /> <li><br /> Любая другая информация. <br /> </ul> <br /> В оформлении страницы следует использовать максимальное количество вышеперечисленных тегов HTML. <br /> <br /> Люди обмениваются визитными карточками. В виртуальном мире визитная карточка - ваша домашняя страничка. Как и визитки, личные сайты встречаются простые в оформлении, довольно вычурные. <br /> <br /> Главное, чтобы оформление и содержание соответствовало цели, для которой ваш Home page появился на сетевых просторах. <br /> <br /> Фирмы заводят себе сайты в Интернете, чтобы найти новых клиентов и рассказать о своем товаре. Через Интернет люди могут рекламировать и себя, то есть рассказывать потенциальному работодателю, какой вы замечательный. <br /> <br /> Например, Артемий Лебедев, вебмастер, работы которого во многом определяют внешний вид всего русскоязычног Интернета (Рунета), поместил на свою домашнюю страничку (http://www.tema.ru/) длинный список сайтов, которые он оформлял, и прикольные графические работы. <br /> <br /> "Некто" напишет, какой он замечательный физик, бухгалтер, переводчик или врач. Когда человек хочет найти новых друзей, единомышленников, он рассказывает о своем увлечении. При этом он не забудет поместить ссылку на свой e-mail или гостевую книгу, чтобы посетители могли оставить сообщение, комментарии. О чем бы ни была домашняя страница нельзя указывать ваш адрес, телефон, подробности биографии. <br /> <br /> <b>Контрольные вопросы:</b><br /> <ol> <li><br /> Что такое WWW? <br /> <li><br /> Что такое URL? <br /> <li><br /> Что такое браузер? <br /> <li><br /> Что такое поисковые сервера и для чего они нужны.<br /> <li><br /> Что такое HTML? <br /> <li><br /> Что такое "тэг"? Назовите несколько. В различие в понятиях "тэг", "контейнер" и "элемент".<br /> <li><br /> Какие части HTML-документа Вы знаете?<br /> <li><br /> Какой тип ссылки использовался в данной Л.Р. и какие типы знаете Вы?<br /> <li><br /> Перечислите способы обтекания текстом картинки. В чём отличие физического и логического форматирования ?<br /> </ol> </dd></dt></dd></dt></dd></dt></dl></dl></blockquote></blockquote></address></div></div></div></listing>

Похожие:

Лабораторная работа №1 Знакомство с Web. Первая html-страница iconЛабораторная работа №1 Знакомство с Web. Первая html-страница
Цель работы: Изучить основы языка html. Создание html страницы с использованием материала прочитанных лекций
Лабораторная работа №1 Знакомство с Web. Первая html-страница icon5 Основы создания web-страниц средствами языка разметки гипертекста html
Цель работы: изучение основ языка разметки гипертекста html и приобретение практических навыков создания html-документов
Лабораторная работа №1 Знакомство с Web. Первая html-страница icon1. Структура html говорит браузеру, что страница, которую он открывает, является html документом
Внутри самого тега-контейнера стоит текст (хотя может быть и картинка), который и является текстом ссылки
Лабораторная работа №1 Знакомство с Web. Первая html-страница iconЛабораторная работа №12 Использование графики в html-документах
Тег вставляет изображение в документ, как если бы оно было просто одним большим символом. Синтаксис тега
Лабораторная работа №1 Знакомство с Web. Первая html-страница iconЛабораторная работа №3
Проверка формулы де Бройля. Знакомство с электронографией как одним из методов исследования структуры вещества. Определение межплоскостных...
Лабораторная работа №1 Знакомство с Web. Первая html-страница iconЛабораторная работа №3
Проверка формулы де Бройля. Знакомство с электронографией как одним из методов исследования структуры вещества. Определение межплоскостных...
Лабораторная работа №1 Знакомство с Web. Первая html-страница iconЛабораторна робота 1 Тема. Створення найпростішої Web-сторінки. Мета. Навчитись створювати найпростішу Web-сторінку. Теоретичні
Документ, складений за допомогою мови розмітки html, являє собою текстовий файл, який можна набрати І відредагувати в звичайному...
Лабораторная работа №1 Знакомство с Web. Первая html-страница iconЛабораторная работа №3 Задание
Посетите сайт одной из платежных систем по вашему выбору (см рекомендуемые web-сайты). Изучите используемые платежные средства и...
Лабораторная работа №1 Знакомство с Web. Первая html-страница iconРеферат на тему: Информационный дизайн web-ресурса: способы проектирования 1 Теоретические основы web дизайна
В результате пересечения двух отраслей человеческой деятельности грамотный Web-дизайнер должен быть знаком с последними Web-технологиями...
Лабораторная работа №1 Знакомство с Web. Первая html-страница iconЛабораторная работа №15 Разработка Web страницы
Байкал. Если так, то первым делом, сделаем заявку в интернете о наших планах, поищем информацию о Байкале (ведь в интернете все есть),...
Лабораторная работа №1 Знакомство с Web. Первая html-страница iconЛабораторная работа №29 Тема: Зачетная работа по теме: «Учет с подотчетными лицами»

Вы можете разместить ссылку на наш сайт:
Документы


При копировании материала укажите ссылку ©ignorik.ru 2015

контакты
Документы