Аватар
Логотип
Название

ТОП публикаций

Партнёрские ссылки

РЕКЛАМА

КАРУСЕЛЬ
Вверх Вниз Стоп Пуск

Разработчик: Валерий ШИШКО

15.15.2017г. 03:30:58   Комментариев: 1

Простая бытовая аналогия для понимания сложной структуры Интернет страницы

Аналогом веб страницы в бытовой технике, по моему мнению, можно считать цифровой телевизор. Аналогом телевизионного экрана, в таком случае послужит веб браузер, страница которого будет показывать картинку и передавать звук.  Цифровой сигнал от телецентра (сервера) будет преобразован в HTML разметку и CSS оформление, понятные браузеру.  HTML поставит все элементы страницы на свои места, а CSS, в соответствии с задумкой автора – нарисует  эти элементы и раскрасит их в нужные цвета.

Для того, чтобы понять как это работает, можно создать простую HTML страницу. Для начала подойдет «Блокнот» - стандартное приложение Windows. Просто скопируйте код, приведенный ниже, и поместите его на пустую страницу блокнота.

<!doctype html>
<html>
<head>
<meta http-equiv="content-type" content="text/html; charset=utf-8" />
<title>HTML and CSS</title>
</head>
<body>

<style>
a {font-size: 50px; color: white; text-decoration: none; margin-left: 25%; padding: 15px; border: solid #8EC2F8; background-color: red; border: solid pink;}
a:hover {background-color: gold; color: crimson; border: solid yellow;}
a:visited {background-color: green; border: 2px solid yellowgreen; color: white;}
</style>

<br><br><br><a href="#">HAPPY NEW YEAR!</a>

</body>
</html>

 

Буквы в комплекте со знаками больше и меньше – это теги. Все, что расположено между тегами style – это CSS, а ниже (до тега body) – HTML разметка.

 

 

Сохранить страницу удобнее на рабочем столе с расширением html, для чего выбрать в меню -> Файл -> Сохранить как -> на вкладке Тип файла выбрать -> Все файлы, а в строке -> Имя файла - написать, например, ng.html или другое название, но обязательно с расширением html.

 

На этом процесс создания первой Интернет страницы – закончен. Для проверки результатов достаточно дважды кликнуть мышкой по сохраненному файлу, и он откроется в браузере, установленном по умолчанию. Изменить фон новогоднего поздравления на золотистый можно наведением мышки, а при клике по поздравлению – фон станет зеленым, как на картинках. Затем обновить страницу, или просто F5, и все снова станет красным.

Подробнее и детальнее об этом можно узнать из видео уроков, ссылки на которые размещены в рекламном блоке.

 

Но HTML в комплекте с CSS  дает только статическое изображение или по телевизионной аналогии – заставку. А как же динамически меняющиеся картинки, например кино. Для генерации динамического контента веб страницы на телецентре (сервере) используется программный язык PHP, который взаимодействует с ПО сервера (обычно Аpache) отправляющего в цифровом виде кусочки динамически изменяющегося изображения. Эти кусочки последовательно преобразовываются в HTML, рисуются CSS и отображаются в браузере. Получить представление об этом грандиозном языке можно из видео уроков в рекламной области.


100%
0%
70.9


 КАРУСЕЛЬ

  Всего комментариев: 1

  • 15.12.2017г.
    Инженер
    Доходчиво и внятно рассказано о том, чем в перспективе можно заменить громоздкий телевизор.