Редактирование web -страницы осуществляется в блокноте , просмотр страницы – в браузере. — КиберПедия 

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

Индивидуальные и групповые автопоилки: для животных. Схемы и конструкции...

Навигация:

Главная Случайная страница Обратная связь ТОП Интересно знать Избранные Новые материалы

Топ:

История развития методов оптимизации: теорема Куна-Таккера, метод Лагранжа, роль выпуклости в оптимизации...

Комплексной системы оценки состояния охраны труда на производственном объекте (КСОТ-П): Цели и задачи Комплексной системы оценки состояния охраны труда и определению факторов рисков по охране труда...

Определение места расположения распределительного центра: Фирма реализует продукцию на рынках сбыта и имеет постоянных поставщиков в разных регионах. Увеличение объема продаж...

Интересное:

Аура как энергетическое поле: многослойную ауру человека можно представить себе подобным...

Средства для ингаляционного наркоза: Наркоз наступает в результате вдыхания (ингаляции) средств, которое осуществляют или с помощью маски...

Влияние предпринимательской среды на эффективное функционирование предприятия: Предпринимательская среда – это совокупность внешних и внутренних факторов, оказывающих влияние на функционирование фирмы...

Дисциплины:

Автоматизация Антропология Археология Архитектура Аудит Биология Бухгалтерия Военная наука Генетика География Геология Демография Журналистика Зоология Иностранные языки Информатика Искусство История Кинематография Компьютеризация Кораблестроение Кулинария Культура Лексикология Лингвистика Литература Логика Маркетинг Математика Машиностроение Медицина Менеджмент Металлургия Метрология Механика Музыкология Науковедение Образование Охрана Труда Педагогика Политология Правоотношение Предпринимательство Приборостроение Программирование Производство Промышленность Психология Радиосвязь Религия Риторика Социология Спорт Стандартизация Статистика Строительство Теология Технологии Торговля Транспорт Фармакология Физика Физиология Философия Финансы Химия Хозяйство Черчение Экология Экономика Электроника Энергетика Юриспруденция

Редактирование web -страницы осуществляется в блокноте , просмотр страницы – в браузере.

2020-11-19 221
Редактирование web -страницы осуществляется в блокноте , просмотр страницы – в браузере. 0.00 из 5.00 0 оценок
Заказать работу

Стр 1 из 2Следующая ⇒

Создание веб-странички.

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

Для его создания можно использовать любой текстовый редактор,  например,  Блокнот.

 

Все документы HTML имеют строго заданную структуру:

 

1. Документ должен начинаться с тега <HTML> и заканчиваться соответствующим закрывающим тегом </HTML>. Эта пара тегов сообщает браузеру, что перед ним действительно документ HTML.

2. Документ HTML состоит из раздела заголовков и тела документа, идущих именно в таком порядке.
Раздел заголовков заключен между тегами <HEAD> и </HEAD> и содержит информацию о документе в целом. В частности, этот раздел должен содержать внутри себя теги <TITLE> и </TITLE>, между которыми размещают "официальный" заголовок документа.

3. Сам текст документа располагается в теле документа.
Тело документа располагается между тегами <BODY> и </BODY>.

РЕДАКТИРОВАНИЕ WEB -СТРАНИЦЫ ОСУЩЕСТВЛЯЕТСЯ В БЛОКНОТЕ, ПРОСМОТР СТРАНИЦЫ – В БРАУЗЕРЕ.

Практическая работа-квест:

Создание веб-странцы с помощью Блокнота.

Задание 1.  

  1. Создайте новую папку, подпишите ее своей фамилией.
  2. Создайте в этой папке текстовый документ (документ блокнота!)

 

 

  1. Щелчком правой кнопки мыши по названию этого документа откройте меню Свойства.
  2. Измените имя и расширение файла и нажмите ок.

 

                        Было                                                              Стало

 

Когда появится окно

нажмите Да.

 

Откройте страничку с помощью Блокнота и добавьте следующий текст:

 

<HTML>

<HEAD>

<TITLE>моя страничка</TITLE>

</HEAD>

<BODY>

Приветствуем Вас на своем сайте!

</BODY>

</HTML>

 

  1. Сохраните документ, закройте и просмотрите его в браузере (лучше не использовать гугл-хром). Страничка должна выглядеть так:

 

 

Если это так, поздравляю! Вы создали свою первую веб-страничку!

Задание 2.

Откройте документ с помощью Блокнота.

2. Внутри блока <BODY> строку

      Приветствуем Вас на своем сайте!

измените на (копирование работает):

<H1 ALIGN="center">

<FONT FACE="Arial" SIZE=16 COLOR="yellow">

Приветствуем Вас на своем сайте!

</FONT>

</H1>

 

Сохраните и обновите страничку в браузере. Должно получиться следующее

 

3. Измените надпись, цвет текста и размер шрифта. Проверьте, что получилось.

4. Вместо «моя страничка» поставьте свою фамилию и инициалы.

 

Задание 3.

Работа с фоном

  1. Откройте Paint и нажмите ctrl + E (E - английская).
  2. Установите размер изображения 100*100:
  4. Создайте фон для своей странички и сохраните в папке под именем fon.jpg.

У меня фон такой

  1. Замените строку <BODY>  на

<BODY bgcolor="gray" background= "fon.jpg">.

  1. Проверьте, как выглядит ваша веб-страница.

Задание 4.

Работа с текстом.

Чтобы изменить начертание текста необходимо прописать нужный текст внутри выбранного тэга:

  1. <b> Полужирный текст </b>
  2. <i> Наклонный текст (курсив) </i>
  3. <u> Подчеркнутый текст </u>
  4. К одному фрагменту текста можно применить сразу несколько тэгов, например <u><b> Полужирный подчеркнутый текст </b></u>.
  5. Если необходимо сделать так, чтобы текст начинался с новой строки, то перед ним ставится тэг <br>

Задание 5.

Обратите внимание: задание выполнено, если все виды форматирования присутствуют (полужирный, курсив, подчеркивание, стихотворение должно выглядеть именно как стихотворение, цвет текста и размер шрифта нужно изменить)!

 

1. Разместите на странице небольшое стихотворение (у меня о фруктах):

 

Осень добрая пришла,
Нам подарки принесла:
 Яблоки душистые,
Персики пушистые,
 Груши золотистые
Осень принесла.

Для этого посмотрите, как был оформлен текст «Приветствуем Вас на своем сайте!». Используйте тэги, указанные выше.

 

2. Сохраните и посмотрите на результат:

Задание 6.

Задание 7. Создание меню.

  1. После ЛОГО добавьте

<center><a href="index.html"> Главная </a>

<a href="1.html"> Первая </a>

<a href="2.html"> Вторая </a>

<a href="3.html"> Третья </a>

<a href="4.html"> Четвертая </a></center>

  1. Сохраните и просмотрите результат в браузере.

  1. Измените на своей странице текст и сохраните ее под именем 1.html

  1. Аналогично создайте странички 2.html, 3.html, 4.html.

  1. Просмотрите результат в браузере и проверьте работу ссылок.

 

Задание 8. Работа с таблицами.

Разместите на одной из страничек такую таблицу

 

1. Для этого внутри блока <BODY> добавьте

<table> - добавление таблицы

<tr> - добавление строки таблицы

<td bgcolor="#FFCC33"> <center> 1x1 </center></td> - добавление столбца таблицы

<td bgcolor="#336699"> <center> 1x2 </center></td>

<td bgcolor="#FFCC33"> <center> 1x3 </center></td>

</tr>

<tr>

<td bgcolor="#336699"> <center> 2x1 </center></td>

<td bgcolor="#FFCC33"> <center> 2x2 </center></td>

<td bgcolor="#336699"> <center> 2x3 </center></td>

</tr>

</table>

 

  1. Зададим высоту и длину таблицы, для этого изменим строку

<table> 

на

<table height="500" >

  1. Добавьте в каждую ячейку таблицы картинку, например таким образом

<td bgcolor="#FFCC33"> <center> <img src= "1_1.jpg" > </center> </td>

  1. Чтобы таблица располагалась по центру страницы блок <table></table> необходимо разместить внутри блока <center> <table> </table> </center>.

 

Пример возможного размещения картинок в таблице:

 

 

Создание веб-странички.

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

Для его создания можно использовать любой текстовый редактор,  например,  Блокнот.

 

Все документы HTML имеют строго заданную структуру:

 

1. Документ должен начинаться с тега <HTML> и заканчиваться соответствующим закрывающим тегом </HTML>. Эта пара тегов сообщает браузеру, что перед ним действительно документ HTML.

2. Документ HTML состоит из раздела заголовков и тела документа, идущих именно в таком порядке.
Раздел заголовков заключен между тегами <HEAD> и </HEAD> и содержит информацию о документе в целом. В частности, этот раздел должен содержать внутри себя теги <TITLE> и </TITLE>, между которыми размещают "официальный" заголовок документа.

3. Сам текст документа располагается в теле документа.
Тело документа располагается между тегами <BODY> и </BODY>.

РЕДАКТИРОВАНИЕ WEB -СТРАНИЦЫ ОСУЩЕСТВЛЯЕТСЯ В БЛОКНОТЕ, ПРОСМОТР СТРАНИЦЫ – В БРАУЗЕРЕ.

Практическая работа-квест:

12Следующая ⇒
Поделиться с друзьями:

Архитектура электронного правительства: Единая архитектура – это методологический подход при создании системы управления государства, который строится...

Общие условия выбора системы дренажа: Система дренажа выбирается в зависимости от характера защищаемого...

Наброски и зарисовки растений, плодов, цветов: Освоить конструктивное построение структуры дерева через зарисовки отдельных деревьев, группы деревьев...

Автоматическое растормаживание колес: Тормозные устройства колес предназначены для уменьше­ния длины пробега и улучшения маневрирования ВС при...



© cyberpedia.su 2017-2024 - Не является автором материалов. Исключительное право сохранено за автором текста.
Если вы не хотите, чтобы данный материал был у нас на сайте, перейдите по ссылке: Нарушение авторских прав. Мы поможем в написании вашей работы!

0.027 с.