Основные понятия в Web-разработке презентация

Front-end – это все то, что видит пользователь на сайте от шрифта, фона, выпадающего меню, слайдера создано с помощью HTML, CSS и JavaScript, контролируется браузером, который установлен на компьютере пользователя.
Основы разработки сайтов на системе управления 1С Битрикс
Урок 1. Основные понятия в Web разработке

Back-end – это программно-административная часть разработки сайта. Именно здесь проходит процесс программирования и наполнения функционалом, создаётся ядро, разрабатывается платформа, выделяется административная зона. Back-end разработчик создаёт серверную часть для интеграции базы данных и обеспечения обмена информацией с пользовательской стороной.
Основы разработки сайтов на системе управления 1С Битрикс
Урок 1. Основные понятия в Web разработке

Основы разработки сайтов на системе управления 1С Битрикс
Урок 1. Основные понятия в Web разработке
Хостинг - услуга по предоставлению места для физического размещения информации на сервере, постоянно подключенном к интернету.
Домен - адрес созданного сайта или определенная зона, которая имеет свое имя, не похожее ни на одно другое в системе доменных имен.

Основы разработки сайтов на системе управления 1С Битрикс
Урок 1. Основные понятия в Web разработке
URL (от англ. Uniform Resource Locator) – это единый указатель ресурса, единообразный локатор (определитель местонахождения) ресурса.

Основы разработки сайтов на системе управления 1С Битрикс
Урок 1. Основные понятия в Web разработке
Веб-сервер — сервер, принимающий HTTP-запросы от клиентов, обычно веб-браузеров, и выдающий им HTTP-ответы, как правило, вместе с HMTL-страницей, изображением, файлом, медиа-потоком или другими данными.
Веб-сервером называют как программное обеспечение, выполняющее функции веб-сервера, так и непосредственно компьютер на котором это программное обеспечение работает. Клиент, которым обычно является веб-браузер, передаёт веб-серверу запросы на получение ресурсов, обозначенных URL-адресами.
Ресурсы — это HMTL-страницы, изображения, файлы, медиа-потоки или другие данные, которые необходимы клиенту. В ответ веб-сервер передаёт клиенту запрошенные данные. Этот обмен происходит по протоколу HTTP.

Основы разработки сайтов на системе управления 1С Битрикс
Урок 1. Основные понятия в Web разработке
HTML (от англ. HyperText Markup Language — «язык гипертекстовой разметки») — стандартизированный язык разметки документов во Всемирной паутине. Веб-страницы содержат описание разметки на языке HTML. Язык HTML интерпретируется браузерами; полученный в результате интерпретации форматированный текст отображается на экране монитора компьютера или мобильного устройства.
Заголовок html страницы
Hello World!

Основы разработки сайтов на системе управления 1С Битрикс
Урок 1. Основные понятия в Web разработке
Тег (tag). Тег HTML это компонент, который командует Web-браузеру выполнить определенную задачу типа создания абзаца или вставки изображения и т.д.
Атрибут (или аргумент). Атрибут HTML изменяет тег. Например, можно выровнять абзац или изображение внутри тега.
Значение. Значения присваиваются атрибутам и определяют вносимые изменения. Например, если для тега используется атрибут выравнивания, то можно указать значение этого атрибута. Значения могут быть текстовыми, типа left или right, а также числовыми, как например ширина и высота изображения, где значения определяют размер изображения в пикселях.
К строчным элементам относятся теги
,
,
и др., а также элементы, у которых свойство display установлено как inline.
В основном они используются для изменения вида текста или его логического выделения.

Основы разработки сайтов на системе управления 1С Битрикс
Урок 1. Основные понятия в Web разработке
Одинарные и парные теги
В языке HTML происходит деление тегов на одинарные (не парные) и парные теги. Итак, одинарные HTML теги состоят из одного тега, то есть, у них нет закрывающего тега. А у парных дескрипторов есть открывающийся и закрывающийся тег.
Не парные теги HTML не имеют закрывающего тега. Например:
,
. Раньше писали так:
,
, теперь такой стиль написания одинарных тегов не актуален, поэтому не пишите так. Самые используемые не парные теги:
- перенос на новую строку,
- разделительная линия,
- вставка изображения.
Парных тегов HTML намного больше. У парного дескриптора (тега) есть открывающий и закрывающий тег. Парный тег образует контейнер. Содержимое контейнера – это то, что находится между открывающим и закрывающим тегом. Например тег
Что такое дескрипторы в HTML?
, это парный тег, содержимым этого тега является текст «Что такое теги в HTML?». Его началом является тег
, а концом
.

Основы разработки сайтов на системе управления 1С Битрикс
Урок 1. Основные понятия в Web разработке
Строчные элементы их характерные особенности.
Внутрь строчных элементов допустимо помещать текст или другие строчные элементы. Вставлять блочные элементы внутрь строчных запрещено.
Эффект схлопывания отступов не действует.
Свойства, связанные с размерами (width, height) не применимы.
Ширина равна содержимому плюс значения отступов, полей и границ.
Несколько строчных элементов идущих подряд располагаются на одной строке и переносятся на другую строку при необходимости.
Можно выравнивать по вертикали с помощью свойства vertical-align.
Для блочных элементов характерны следующие особенности.
Блоки располагаются по вертикали друг под другом.
На прилегающих сторонах элементов действует эффект схлопывания отступов.
Запрещено вставлять блочный элемент внутрь строчного. Например,
Заголовок
не пройдёт валидацию, правильно вложить теги наоборот —
Заголовок
.
По ширине блочные элементы занимают всё допустимое пространство.
Если задана ширина контента (свойство width), то ширина блока складывается из значений width, полей, границ, отступов слева и справа.
Высота блочного элемента вычисляется браузером автоматически, исходя из содержимого блока.
Если задана высота контента (свойство height), то высота блока складывается из значения height, полей, границ, отступов сверху и снизу. При превышении указанной высоты контент отображается поверх блока.
На блочные элементы не действуют свойства, предназначенные для строчных элементов, вроде vertical-align.
Текст по умолчанию выравнивается по левому краю.

Основы разработки сайтов на системе управления 1С Битрикс
Урок 1. Основные понятия в Web разработке
Элемент предназначен для указания типа текущего документа. Это необходимо, чтобы браузер понимал, как следует интерпретировать текущую веб-страницу, поскольку HTML существует в нескольких версиях, кроме того, имеется XHTML (расширенный язык разметки гипертекста), похожий на HTML, но различающийся с ним по синтаксису.
Тег является контейнером, который заключает в себе все содержимое веб-страницы, включая теги и .
Тег предназначен для хранения других элементов, цель которых — помочь браузеру в работе с данными.
Элемент
определяет заголовок документа. Он не является частью документа и не показывается напрямую на веб-странице. Допускается использовать только один тег <title> на документ и размещать его в контейнере <head>.<br><p><meta> определяет метатеги, которые используются для хранения информации предназначенной для браузеров и поисковых систем.<br><p>Элемент <body> предназначен для хранения содержания веб-страницы (контента), отображаемого в окне браузера. Информацию, которую следует выводить в документе, следует располагать именно внутри контейнера <body>. К такой информации относится текст, изображения, теги, скрипты JavaScript и т.д.<br></div><!----><!--]--><!----></div></div><div class="slides-wrapper"><div id="slide12" class="slides-item"><!--[--><h3 class="slides-heading"><a class="slides-headingLink" href="/_ipx/w_720/imagesDir/jpg/218939/slide-11.jpg" target="_blank" rel="noopener">Слайд 12</a><h3 class="slides-content text-center font-bold"><div><p>Основы разработки сайтов на системе управления 1С Битрикс<br>Урок 1. Основные понятия в Web</div></h3></h3><!----><!----><div class="slides-content">разработке<br><p><h1>,...,<h6> HTML предлагает шесть заголовков разного уровня, которые показывают относительную важность секции, расположенной после заголовка. Так, тег <h1> представляет собой наиболее важный заголовок первого уровня, а тег <h6> служит для обозначения заголовка шестого уровня и является наименее значительным. По умолчанию, заголовок первого уровня отображается самым крупным шрифтом жирного начертания, заголовки последующего уровня по размеру меньше. Теги <h1>,...,<h6> относятся к блочным элементам, они всегда начинаются с новой строки, а после них другие элементы отображаются на следующей строке. Кроме того, перед заголовком и после него добавляется пустое пространство.<br><p><p> Определяет текстовый абзац. Тег <p> является блочным элементом, всегда начинается с новой строки, абзацы текста идущие друг за другом разделяются между собой отбивкой.<br><p>Тег <img> предназначен для отображения на веб-странице изображений в графическом формате GIF, JPEG или PNG. Адрес файла с картинкой задаётся через атрибут src. Если необходимо, то рисунок можно сделать ссылкой на другой файл, поместив тег <img> в контейнер <a>. При этом вокруг изображения отображается рамка, которую можно убрать, добавив атрибут border="0" в тег <img>.<br><p>Тег <a> является одним из важных элементов HTML и предназначен для создания ссылок. В зависимости от присутствия атрибутов name или href тег <a> устанавливает ссылку или якорь. Якорем называется закладка внутри страницы, которую можно указать в качестве цели ссылки. При использовании ссылки, которая указывает на якорь, происходит переход к закладке внутри веб-страницы.<br></div><!----><!--]--><!----></div></div><div class="slides-wrapper"><!----></div><!--]--></div><div class="section"><div></div></div><form id="download" action="/api/" method="post" class="download"><!----><div class="download-description"> Имя файла: Основные-понятия-в-Web-разработке.pptx <br> Количество просмотров: 74 <br> Количество скачиваний: 0</div><button class="download-btn" type="submit">Скачать</button><!----></form><div class="navigation"><div class="navigation-item"><div>- Предыдущая</div><a href="/istoriya/razvitie-perevodcheskoy-deyatelnosti" class="navigation-link">Развитие переводческой деятельности</a></div><div class="navigation-item"><div>Следующая -</div><a href="/menedzhment/obshchiy-menedzhment-istoriya-menedzhmenta" class="navigation-link">Общий менеджмент. История менеджмента</a></div></div></div></div><div class="item-layoutRelated"><div class="section"><div></div></div></div></div><div class="item-layout"><div class="related"><h2 class="related-header">Похожие презентации</h2><div class="related-wrapper"><!--[--><div class="related-item"><a href="/informatika/sovremennyy-ethernet" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/93599/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/93599/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/93599/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/93599/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/93599/slide-0.jpg 1440w" class="slides-image related-itemImage"> Современный ethernet</a></div><div class="related-item"><a href="/informatika/prikladnoe-programmnoe-obespechenie-lektsiya-12" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/101367/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/101367/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/101367/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/101367/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/101367/slide-0.jpg 1440w" class="slides-image related-itemImage"> Прикладное программное обеспечение. (Лекция 12)</a></div><div class="related-item"><a href="/informatika/programmirovanie-na-yazyke-java-primitivnye-tipy" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/127788/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/127788/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/127788/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/127788/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/127788/slide-0.jpg 1440w" class="slides-image related-itemImage"> Программирование на языке Java. Примитивные типы данных. Операции, комментарии. (Лекция 2.1)</a></div><div class="related-item"><a href="/informatika/tipy-dannyh-asdp" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/608509/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/608509/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/608509/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/608509/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/608509/slide-0.jpg 1440w" class="slides-image related-itemImage"> Типы данных АСДП</a></div><div class="related-item"><a href="/informatika/partionnaya-pochta-predpochtovaya-podgotovka-organizatsii" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/205532/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/205532/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/205532/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/205532/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/205532/slide-0.jpg 1440w" class="slides-image related-itemImage"> Партионная почта - предпочтовая подготовка организации</a></div><div class="related-item"><a href="/informatika/5-klass-prezentatsii-k-uchebniku-bosova" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/480787/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/480787/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/480787/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/480787/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/480787/slide-0.jpg 1440w" class="slides-image related-itemImage"> 5 класс Презентации к учебнику Босова Л.Л.</a></div><div class="related-item"><a href="/informatika/graficheskiy-redaktor-paint-planiruem-posledovatelnost-deystviy" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/223458/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/223458/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/223458/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/223458/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/223458/slide-0.jpg 1440w" class="slides-image related-itemImage"> Графический редактор Paint. Планируем последовательность действий</a></div><div class="related-item"><a href="/informatika/bazy-dannyh-12-23" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/6294/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/6294/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/6294/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/6294/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/6294/slide-0.jpg 1440w" class="slides-image related-itemImage"> Базы Данных (§12 - §23)</a></div><div class="related-item"><a href="/informatika/internet--drug-ili-vrag" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/18687/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/18687/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/18687/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/18687/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/18687/slide-0.jpg 1440w" class="slides-image related-itemImage"> Интернет – друг или враг</a></div><div class="related-item"><a href="/informatika/robinet-a-relire-relu" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/111330/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/111330/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/111330/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/111330/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/111330/slide-0.jpg 1440w" class="slides-image related-itemImage"> Robinet a relire - Relu</a></div><div class="related-item"><a href="/informatika/kompyuternye-igry--vid-novogo-iskusstva-1" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/362481/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/362481/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/362481/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/362481/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/362481/slide-0.jpg 1440w" class="slides-image related-itemImage"> Компьютерные игры – вид нового искусства</a></div><div class="related-item"><a href="/informatika/tema-n3-osnovy-relyatsionnoy-teorii-baz" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/97639/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/97639/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/97639/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/97639/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/97639/slide-0.jpg 1440w" class="slides-image related-itemImage"> Тема №3. Основы реляционной теории баз данных</a></div><div class="related-item"><a href="/informatika/vidy-informatsii-7" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/530527/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/530527/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/530527/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/530527/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/530527/slide-0.jpg 1440w" class="slides-image related-itemImage"> Виды информации</a></div><div class="related-item"><a href="/informatika/derekter-oryn-basaratyn-zhyelerd-basty-funktsiyalary" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/6308/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/6308/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/6308/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/6308/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/6308/slide-0.jpg 1440w" class="slides-image related-itemImage"> Деректер қорын басқаратын жүйелердің басты функциялары</a></div><div class="related-item"><a href="/informatika/semiurovnevaya-model-osi-2" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/350113/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/350113/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/350113/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/350113/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/350113/slide-0.jpg 1440w" class="slides-image related-itemImage"> Семиуровневая модель OSI</a></div><div class="related-item"><a href="/informatika/tsikly-turbo-pascal" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/237022/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/237022/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/237022/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/237022/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/237022/slide-0.jpg 1440w" class="slides-image related-itemImage"> Циклы Turbo Pascal</a></div><div class="related-item"><a href="/informatika/zavdannya-napisati-programu-yaka-perevodit-chisla" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/96077/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/96077/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/96077/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/96077/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/96077/slide-0.jpg 1440w" class="slides-image related-itemImage"> Завдання: Написати програму, яка переводить числа з арабської системи в римську</a></div><div class="related-item"><a href="/informatika/vypolnenie-algoritmov-ispolnitelya" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/132339/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/132339/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/132339/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/132339/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/132339/slide-0.jpg 1440w" class="slides-image related-itemImage"> Выполнение алгоритмов исполнителя</a></div><div class="related-item"><a href="/informatika/markuvannya-spozhivchih-tovarv" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/23866/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/23866/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/23866/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/23866/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/23866/slide-0.jpg 1440w" class="slides-image related-itemImage"> Маркування споживчих товарів</a></div><div class="related-item"><a href="/informatika/informatsionnye-sistemy-12" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/398546/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/398546/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/398546/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/398546/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/398546/slide-0.jpg 1440w" class="slides-image related-itemImage"> Информационные системы</a></div><div class="related-item"><a href="/informatika/erp-sistema-sap-arhitektura-lektsiya-12" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/317736/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/317736/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/317736/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/317736/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/317736/slide-0.jpg 1440w" class="slides-image related-itemImage"> ERP - система SAP: архитектура (лекция 12)</a></div><div class="related-item"><a href="/informatika/arhitektura-evm-ustroystva-vyvoda" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/269891/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/269891/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/269891/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/269891/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/269891/slide-0.jpg 1440w" class="slides-image related-itemImage"> Архитектура ЭВМ. Устройства вывода</a></div><div class="related-item"><a href="/informatika/ispolzovanie-igrovoy-sredy-programmirovaniya-scratch-kak-1" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/581795/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/581795/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/581795/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/581795/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/581795/slide-0.jpg 1440w" class="slides-image related-itemImage"> Использование игровой среды программирования Scratch, как интуитивного программирования, при изучении раздела Алгоритмизация</a></div><div class="related-item"><a href="/informatika/yazyk-programmirovaniya-python-8" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/582672/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/582672/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/582672/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/582672/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/582672/slide-0.jpg 1440w" class="slides-image related-itemImage"> Язык программирования Python</a></div><div class="related-item"><a href="/informatika/rozroblennya-modulya-upravlnnya-bznes-protsesami-orendi" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/346883/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/346883/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/346883/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/346883/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/346883/slide-0.jpg 1440w" class="slides-image related-itemImage"> Розроблення модуля Управління бізнес-процесами оренди автомобілів на основі Web-технологій</a></div><div class="related-item"><a href="/informatika/seminar-zdorovesberegayushchie-tehnologii-na-urokah-informatiki" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/540538/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/540538/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/540538/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/540538/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/540538/slide-0.jpg 1440w" class="slides-image related-itemImage"> семинар Здоровьесберегающие технологии на уроках информатики</a></div><div class="related-item"><a href="/informatika/podgotovka-faylov-k-pechati-formaty-faylov" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/423601/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/423601/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/423601/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/423601/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/423601/slide-0.jpg 1440w" class="slides-image related-itemImage"> Подготовка файлов к печати. Форматы файлов, цветовые раскладки и разница между векторной и растровой графикой</a></div><div class="related-item"><a href="/informatika/rekursiya-v-programmirovanii" class="related-itemLink"><img src="/_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/245537/slide-0.jpg" onerror="this.setAttribute('data-error', 1)" width="720" height="540" alt loading="eager" data-nuxt-img sizes="(max-width: 1024px) 480px, 720px" srcset="/_ipx/f_webp&q_80&fit_contain&s_480x360/imagesDir/jpg/245537/slide-0.jpg 480w, /_ipx/f_webp&q_80&fit_contain&s_720x540/imagesDir/jpg/245537/slide-0.jpg 720w, /_ipx/f_webp&q_80&fit_contain&s_960x720/imagesDir/jpg/245537/slide-0.jpg 960w, /_ipx/f_webp&q_80&fit_contain&s_1440x1080/imagesDir/jpg/245537/slide-0.jpg 1440w" class="slides-image related-itemImage"> Рекурсия в программировании</a></div><!--]--></div></div></div></div><!--]--><!--]--><!--]--></div></div></main><footer class="footer"><div class="layout"><!----><div class="footer-contacts"><svg class="footer-contactsIcon" viewBox="0 0 27 26" xmlns="http://www.w3.org/2000/svg"><use xlink:href="/images/icons.svg#contacts"></use></svg> Обратная связь</div><!----><div class="footer-contactsEmail"> Email: <span class="footer-contactsShow">Нажмите что бы посмотреть</span></div></div></footer></div><!--]--></div><script>window.__NUXT__=(function(a,b,c,d,e,f,g,h,i,j,k,l,m,n,o,p,q,r,s,t,u,v,w,x,y,z,A,B,C,D,E,F,G,H,I,J,K,L,M,N,O,P,Q){return {data:{meta:{result:{meta:{h1:l,main_text:a,main_title:m,main_description:n,main_keywords:o,main_image:a},app:{logo_image:p,logo_image_width:q,logo_image_height:r,logo_text:a,image_width_full:s,image_width_min:t,recaptcha_key:u,yandex_search:v,ya_context:c,banner_1:a,banner_2:a,banner_3:a,banner_4:a,banner_5:a,banner_6:a,banner_7:a,banner_8:a,banner_9:a,banner_10:a,email:w,footer_before:a,footer:a,dark_theme:c,strategy:{image_alt_words:h,item_slide_header:x,item_images:y,item_images_tag:z,item_words_h3:c,item_words_tag:A,item_words_1:h,routing:B,item_slide_skipping:C,item_download_timeout:D,item_slider_width:E,item_show_pdf:e,item_show_contents:e,item_show_filename:e},colors:{header_text:j,header_bg:i,accent:i}},social:F}},item:{result:{id:218939,name:k,category:G,count:h,jpg:"jpg\u002F218939",hits:74,download:b,h1:"Основные понятия в Web-разработке презентация",meta:{h1:k,title:k,description:"Основные понятия в Web-разработке презентация на тему, доклад, Информатика",keywords:"Основные понятия в Web-разработке, презентация, доклад, проект, скачать, на тему, PowerPoint, урок, класс, школа, Информатика",download_link:a},text:"Вы можете изучить и скачать доклад-презентацию на тему Презентация на тему Основные понятия в Web-разработке из раздела Информатика. Презентация на заданную тему содержит 13 слайдов. Для просмотра воспользуйтесь проигрывателем, если материал оказался полезным для Вас - поделитесь им с друзьями с помощью социальных кнопок и добавьте наш сайт презентаций в закладки!",seo_text:"\u003Cp\u003E\u003Cbr\u003E\u003Cp\u003E\t Front-end – это все то, что видит пользователь на сайте от шрифта, фона, выпадающего меню, слайдера создано с помощью HTML, CSS и JavaScript, контролируется браузером, который установлен на компьютере пользователя.\u003Cbr\u003E\u003Cp\u003E\u003Cbr\u003E\u003Cp\u003EОсновы разработ",file:"Основные-понятия-в-Web-разработке.pptx",texts:["\u003Cp\u003EОсновы разработки сайтов на\u003Cbr\u003Eсистеме управления 1С Битрикс\u003Cbr\u003E\u003Cp\u003EУрок 1. Основные понятия в Web разработке\u003Cbr\u003E\u003Cp\u003EВеб-разработка\u003Cbr\u003E процесс создания сайта или веб-приложения. Сюда входит вёрстка сайта и программирование сайта, проектирование баз данных, разработка административного интерфейса, а также конфигурирование веб-сервера.​\u003Cbr\u003E","\u003Cp\u003E\t Front-end – это все то, что видит пользователь на сайте от шрифта, фона, выпадающего меню, слайдера создано с помощью HTML, CSS и JavaScript, контролируется браузером, который установлен на компьютере пользователя.\u003Cbr\u003E\u003Cp\u003EОсновы разработки сайтов на системе управления 1С Битрикс\u003Cbr\u003EУрок 1. Основные понятия в Web разработке\u003Cbr\u003E","\u003Cp\u003E\t Back-end – это программно-административная часть разработки сайта. Именно здесь проходит процесс программирования и наполнения функционалом, создаётся ядро, разрабатывается платформа, выделяется административная зона. Back-end разработчик создаёт серверную часть для интеграции базы данных и обеспечения обмена информацией с пользовательской стороной.\u003Cbr\u003E\u003Cp\u003EОсновы разработки сайтов на системе управления 1С Битрикс\u003Cbr\u003EУрок 1. Основные понятия в Web разработке\u003Cbr\u003E","\u003Cp\u003EОсновы разработки сайтов на системе управления 1С Битрикс\u003Cbr\u003EУрок 1. Основные понятия в Web разработке\u003Cbr\u003E\u003Cp\u003E\tХостинг - услуга по предоставлению места для физического размещения информации на сервере, постоянно подключенном к интернету.\u003Cbr\u003E\u003Cp\u003E \u003Cbr\u003E\u003Cp\u003E \u003Cbr\u003E\u003Cp\u003E \u003Cbr\u003E\u003Cp\u003E \u003Cbr\u003E\u003Cp\u003E \u003Cbr\u003E\u003Cp\u003E\tДомен - адрес созданного сайта или определенная зона, которая имеет свое имя, не похожее ни на одно другое в системе доменных имен.\u003Cbr\u003E","\u003Cp\u003EОсновы разработки сайтов на системе управления 1С Битрикс\u003Cbr\u003EУрок 1. Основные понятия в Web разработке\u003Cbr\u003E\u003Cp\u003EURL (от англ. Uniform Resource Locator) – это единый указатель ресурса, единообразный локатор (определитель местонахождения) ресурса.\u003Cbr\u003E","\u003Cp\u003EОсновы разработки сайтов на системе управления 1С Битрикс\u003Cbr\u003EУрок 1. Основные понятия в Web разработке\u003Cbr\u003E\u003Cp\u003EВеб-сервер — сервер, принимающий HTTP-запросы от клиентов, обычно веб-браузеров, и выдающий им HTTP-ответы, как правило, вместе с HMTL-страницей, изображением, файлом, медиа-потоком или другими данными.\u003Cbr\u003E\u003Cp\u003EВеб-сервером называют как программное обеспечение, выполняющее функции веб-сервера, так и непосредственно компьютер на котором это программное обеспечение работает. Клиент, которым обычно является веб-браузер, передаёт веб-серверу запросы на получение ресурсов, обозначенных URL-адресами. \u003Cbr\u003E\u003Cp\u003EРесурсы — это HMTL-страницы, изображения, файлы, медиа-потоки или другие данные, которые необходимы клиенту. В ответ веб-сервер передаёт клиенту запрошенные данные. Этот обмен происходит по протоколу HTTP.\u003Cbr\u003E","\u003Cp\u003EОсновы разработки сайтов на системе управления 1С Битрикс\u003Cbr\u003EУрок 1. Основные понятия в Web разработке\u003Cbr\u003E\u003Cp\u003E\tHTML (от англ. HyperText Markup Language — «язык гипертекстовой разметки») — стандартизированный язык разметки документов во Всемирной паутине. Веб-страницы содержат описание разметки на языке HTML. Язык HTML интерпретируется браузерами; полученный в результате интерпретации форматированный текст отображается на экране монитора компьютера или мобильного устройства.\u003Cbr\u003E\u003Cp\u003E\u003C!DOCTYPE html\u003E \u003C!– Тип документа --\u003E\r\n\u003Chtml lang=\"ru\"\u003E \u003C!– Главный тег (контейнер) --\u003E \r\n\u003Chead\u003E \u003C!– Тег «помощник» --\u003E \r\n \u003Cmeta charset=\"UTF-8\"\u003E \u003C!– Мета тег кодировка --\u003E \r\n \u003Cmeta name=\"viewport” content=\"width=device-width, initial-scale=1.0”\u003E \u003C!– Мета тег определяет ширину --\u003E \r\n \u003Clink rel=\"stylesheet\" href=\"css.css\" type=\"text\u002Fcss\"\u003E \u003C!– Подключение стилей css--\u003E \r\n \u003Ctitle\u003EЗаголовок html страницы\u003C\u002Ftitle\u003E \u003C!– Тег заголовка документа--\u003E \r\n\u003C\u002Fhead\u003E\r\n\u003Cbody\u003E \u003C!– Тело страницы --\u003E \r\n \u003Ch1\u003EHello World!\u003C\u002Fh1\u003E \u003C!– Тег заголовка--\u003E \r\n\u003C\u002Fbody\u003E\r\n\u003C\u002Fhtml\u003E\u003Cbr\u003E","\u003Cp\u003EОсновы разработки сайтов на системе управления 1С Битрикс\u003Cbr\u003EУрок 1. Основные понятия в Web разработке\u003Cbr\u003E\u003Cp\u003EТег (tag). Тег HTML это компонент, который командует Web-браузеру выполнить определенную задачу типа создания абзаца или вставки изображения и т.д.\u003Cbr\u003E\u003Cp\u003EАтрибут (или аргумент). Атрибут HTML изменяет тег. Например, можно выровнять абзац или изображение внутри тега.\u003Cbr\u003E\u003Cp\u003EЗначение. Значения присваиваются атрибутам и определяют вносимые изменения. Например, если для тега используется атрибут выравнивания, то можно указать значение этого атрибута. Значения могут быть текстовыми, типа left или right, а также числовыми, как например ширина и высота изображения, где значения определяют размер изображения в пикселях.\u003Cbr\u003E\u003Cp\u003EК строчным элементам относятся теги \u003Cimg\u003E, \u003Cspan\u003E, \u003Ca\u003E и др., а также элементы, у которых свойство display установлено как inline. \u003Cbr\u003EВ основном они используются для изменения вида текста или его логического выделения.\u003Cbr\u003E","\u003Cp\u003EОсновы разработки сайтов на системе управления 1С Битрикс\u003Cbr\u003EУрок 1. Основные понятия в Web разработке\u003Cbr\u003E\u003Cp\u003EОдинарные и парные теги\u003Cbr\u003E\u003Cp\u003EВ языке HTML происходит деление тегов на одинарные (не парные) и парные теги. Итак, одинарные HTML теги состоят из одного тега, то есть, у них нет закрывающего тега. А у парных дескрипторов есть открывающийся и закрывающийся тег.\u003Cbr\u003E\u003Cp\u003EНе парные теги HTML не имеют закрывающего тега. Например: \u003Cbr\u003E, \u003Cimg\u003E. Раньше писали так: \u003Cbr\u003E, \u003Cimg\u003E, теперь такой стиль написания одинарных тегов не актуален, поэтому не пишите так. Самые используемые не парные теги: \u003Cbr\u003E - перенос на новую строку, \u003Chr\u003E - разделительная линия, \u003Cimg\u003E - вставка изображения.\u003Cbr\u003E\u003Cp\u003EПарных тегов HTML намного больше. У парного дескриптора (тега) есть открывающий и закрывающий тег. Парный тег образует контейнер. Содержимое контейнера – это то, что находится между открывающим и закрывающим тегом. Например тег \u003Ch1\u003EЧто такое дескрипторы в HTML?\u003C\u002Fh1\u003E, это парный тег, содержимым этого тега является текст «Что такое теги в HTML?». Его началом является тег \u003Ch1\u003E, а концом \u003C\u002Fh1\u003E.\u003Cbr\u003E","\u003Cp\u003EОсновы разработки сайтов на системе управления 1С Битрикс\u003Cbr\u003EУрок 1. Основные понятия в Web разработке\u003Cbr\u003E\u003Cp\u003EСтрочные элементы их характерные особенности.\u003Cbr\u003EВнутрь строчных элементов допустимо помещать текст или другие строчные элементы. Вставлять блочные элементы внутрь строчных запрещено.\u003Cbr\u003EЭффект схлопывания отступов не действует.\u003Cbr\u003EСвойства, связанные с размерами (width, height) не применимы.\u003Cbr\u003EШирина равна содержимому плюс значения отступов, полей и границ.\u003Cbr\u003EНесколько строчных элементов идущих подряд располагаются на одной строке и переносятся на другую строку при необходимости.\u003Cbr\u003EМожно выравнивать по вертикали с помощью свойства vertical-align.\u003Cbr\u003E\u003Cp\u003EДля блочных элементов характерны следующие особенности.\u003Cbr\u003EБлоки располагаются по вертикали друг под другом.\u003Cbr\u003EНа прилегающих сторонах элементов действует эффект схлопывания отступов.\u003Cbr\u003EЗапрещено вставлять блочный элемент внутрь строчного. Например, \u003Ca\u003E\u003Ch1\u003EЗаголовок\u003C\u002Fh1\u003E\u003C\u002Fa\u003E не пройдёт валидацию, правильно вложить теги наоборот — \u003Ch1\u003E\u003Ca\u003EЗаголовок\u003C\u002Fa\u003E\u003C\u002Fh1\u003E.\u003Cbr\u003EПо ширине блочные элементы занимают всё допустимое пространство.\u003Cbr\u003EЕсли задана ширина контента (свойство width), то ширина блока складывается из значений width, полей, границ, отступов слева и справа.\u003Cbr\u003EВысота блочного элемента вычисляется браузером автоматически, исходя из содержимого блока.\u003Cbr\u003EЕсли задана высота контента (свойство height), то высота блока складывается из значения height, полей, границ, отступов сверху и снизу. При превышении указанной высоты контент отображается поверх блока.\u003Cbr\u003EНа блочные элементы не действуют свойства, предназначенные для строчных элементов, вроде vertical-align.\u003Cbr\u003EТекст по умолчанию выравнивается по левому краю.\u003Cbr\u003E","\u003Cp\u003EОсновы разработки сайтов на системе управления 1С Битрикс\u003Cbr\u003EУрок 1. Основные понятия в Web разработке\u003Cbr\u003E\u003Cp\u003EЭлемент \u003C!DOCTYPE\u003E предназначен для указания типа текущего документа. Это необходимо, чтобы браузер понимал, как следует интерпретировать текущую веб-страницу, поскольку HTML существует в нескольких версиях, кроме того, имеется XHTML (расширенный язык разметки гипертекста), похожий на HTML, но различающийся с ним по синтаксису. \u003Cbr\u003E\u003Cp\u003EТег \u003Chtml\u003E является контейнером, который заключает в себе все содержимое веб-страницы, включая теги \u003Chead\u003E и \u003Cbody\u003E.\u003Cbr\u003E\u003Cp\u003EТег \u003Chead\u003E предназначен для хранения других элементов, цель которых — помочь браузеру в работе с данными.\u003Cbr\u003E\u003Cp\u003EЭлемент \u003Ctitle\u003E определяет заголовок документа. Он не является частью документа и не показывается напрямую на веб-странице. Допускается использовать только один тег \u003Ctitle\u003E на документ и размещать его в контейнере \u003Chead\u003E.\u003Cbr\u003E\u003Cp\u003E\u003Cmeta\u003E определяет метатеги, которые используются для хранения информации предназначенной для браузеров и поисковых систем.\u003Cbr\u003E\u003Cp\u003EЭлемент \u003Cbody\u003E предназначен для хранения содержания веб-страницы (контента), отображаемого в окне браузера. Информацию, которую следует выводить в документе, следует располагать именно внутри контейнера \u003Cbody\u003E. К такой информации относится текст, изображения, теги, скрипты JavaScript и т.д.\u003Cbr\u003E","\u003Cp\u003EОсновы разработки сайтов на системе управления 1С Битрикс\u003Cbr\u003EУрок 1. Основные понятия в Web разработке\u003Cbr\u003E\u003Cp\u003E\u003Ch1\u003E,...,\u003Ch6\u003E HTML предлагает шесть заголовков разного уровня, которые показывают относительную важность секции, расположенной после заголовка. Так, тег \u003Ch1\u003E представляет собой наиболее важный заголовок первого уровня, а тег \u003Ch6\u003E служит для обозначения заголовка шестого уровня и является наименее значительным. По умолчанию, заголовок первого уровня отображается самым крупным шрифтом жирного начертания, заголовки последующего уровня по размеру меньше. Теги \u003Ch1\u003E,...,\u003Ch6\u003E относятся к блочным элементам, они всегда начинаются с новой строки, а после них другие элементы отображаются на следующей строке. Кроме того, перед заголовком и после него добавляется пустое пространство.\u003Cbr\u003E\u003Cp\u003E\u003Cp\u003E Определяет текстовый абзац. Тег \u003Cp\u003E является блочным элементом, всегда начинается с новой строки, абзацы текста идущие друг за другом разделяются между собой отбивкой.\u003Cbr\u003E\u003Cp\u003EТег \u003Cimg\u003E предназначен для отображения на веб-странице изображений в графическом формате GIF, JPEG или PNG. Адрес файла с картинкой задаётся через атрибут src. Если необходимо, то рисунок можно сделать ссылкой на другой файл, поместив тег \u003Cimg\u003E в контейнер \u003Ca\u003E. При этом вокруг изображения отображается рамка, которую можно убрать, добавив атрибут border=\"0\" в тег \u003Cimg\u003E.\u003Cbr\u003E\u003Cp\u003EТег \u003Ca\u003E является одним из важных элементов HTML и предназначен для создания ссылок. В зависимости от присутствия атрибутов name или href тег \u003Ca\u003E устанавливает ссылку или якорь. Якорем называется закладка внутри страницы, которую можно указать в качестве цели ссылки. При использовании ссылки, которая указывает на якорь, происходит переход к закладке внутри веб-страницы.\u003Cbr\u003E","\u003Cp\u003EОсновы разработки сайтов на системе управления 1С Битрикс\u003Cbr\u003EУрок 1. Основные понятия в Web разработке\u003Cbr\u003E\u003Cp\u003EТег \u003Cul\u003E устанавливает маркированный список. Каждый элемент списка должен начинаться с тега \u003Cli\u003E. Если к тегу \u003Cul\u003E применяется таблица стилей, то элементы \u003Cli\u003E наследуют эти свойства.\u003Cbr\u003E\u003Cp\u003E\u003C!DOCTYPE html\u003E\r\n\u003Chtml lang=\"ru\"\u003E\r\n\u003Chead\u003E\r\n \u003Cmeta charset=\"UTF-8\"\u003E\r\n \u003Cmeta name=\"viewport” content=\"width=device-width, initial-scale=1.0”\u003E\r\n \u003Clink rel=\"stylesheet\" href=\"css.css\" type=\"text\u002Fcss”\u003E \r\n \u003Ctitle\u003EЗаголовок html страницы\u003C\u002Ftitle\u003E\r\n\u003C\u002Fhead\u003E\r\n\u003Cbody\u003E\r\n \u003Cul\u003E\u003Cbr\u003E \u003Cli\u003EПункт 1\u003C\u002Fli\u003E\u003Cbr\u003E \u003Cli\u003EПункт 1\u003C\u002Fli\u003E\u003Cbr\u003E \u003Cli\u003EПункт 1\u003C\u002Fli\u003E\u003Cbr\u003E \u003C\u002Ful\u003E\r\n\u003C\u002Fbody\u003E\r\n\u003C\u002Fhtml\u003E\u003Cbr\u003E\u003Cp\u003EАтрибуты\u003Cbr\u003EДля тега \u003Cul\u003E\u003Cbr\u003Etype=\"disc | circle | square” - Устанавливает вид маркера.\u003Cbr\u003EДля тега \u003Col\u003E\u003Cbr\u003EReversed - Меняет нумерацию в списке на обратный порядок, вместо 1,2,3 будет выводиться 3,2,1.\u003Cbr\u003EStart - устанавливает номер, с которого будет начинаться список. При этом не имеет значения, какой тип списка установлен с помощью type, атрибут start одинаково работает и с римскими и с арабскими числами.\u003Cbr\u003Etype=\"A | a | I | i | 1” - Устанавливает вид маркера.\u003Cbr\u003E"],href:"\u002Finformatika\u002Fosnovnye-ponyatiya-v-web-razrabotke",href_category:"\u002Finformatika",date:1633956324,related:[{id:93599,name:"Современный ethernet",href:"\u002Finformatika\u002Fsovremennyy-ethernet",jpg:"jpg\u002F93599"},{id:101367,name:"Прикладное программное обеспечение. (Лекция 12)",href:"\u002Finformatika\u002Fprikladnoe-programmnoe-obespechenie-lektsiya-12",jpg:"jpg\u002F101367"},{id:127788,name:"Программирование на языке Java. Примитивные типы данных. Операции, комментарии. (Лекция 2.1)",href:"\u002Finformatika\u002Fprogrammirovanie-na-yazyke-java-primitivnye-tipy",jpg:"jpg\u002F127788"},{id:608509,name:"Типы данных АСДП",href:"\u002Finformatika\u002Ftipy-dannyh-asdp",jpg:"jpg\u002F608509"},{id:205532,name:"Партионная почта - предпочтовая подготовка организации",href:"\u002Finformatika\u002Fpartionnaya-pochta-predpochtovaya-podgotovka-organizatsii",jpg:"jpg\u002F205532"},{id:480787,name:"5 класс Презентации к учебнику Босова Л.Л.",href:"\u002Finformatika\u002F5-klass-prezentatsii-k-uchebniku-bosova",jpg:"jpg\u002F480787"},{id:223458,name:"Графический редактор Paint. Планируем последовательность действий",href:"\u002Finformatika\u002Fgraficheskiy-redaktor-paint-planiruem-posledovatelnost-deystviy",jpg:"jpg\u002F223458"},{id:6294,name:"Базы Данных (§12 - §23)",href:"\u002Finformatika\u002Fbazy-dannyh-12-23",jpg:"jpg\u002F6294"},{id:18687,name:"Интернет – друг или враг",href:"\u002Finformatika\u002Finternet--drug-ili-vrag",jpg:"jpg\u002F18687"},{id:111330,name:"Robinet a relire - Relu",href:"\u002Finformatika\u002Frobinet-a-relire-relu",jpg:"jpg\u002F111330"},{id:362481,name:"Компьютерные игры – вид нового искусства",href:"\u002Finformatika\u002Fkompyuternye-igry--vid-novogo-iskusstva-1",jpg:"jpg\u002F362481"},{id:97639,name:"Тема №3. Основы реляционной теории баз данных",href:"\u002Finformatika\u002Ftema-n3-osnovy-relyatsionnoy-teorii-baz",jpg:"jpg\u002F97639"},{id:530527,name:"Виды информации",href:"\u002Finformatika\u002Fvidy-informatsii-7",jpg:"jpg\u002F530527"},{id:6308,name:"Деректер қорын басқаратын жүйелердің басты функциялары",href:"\u002Finformatika\u002Fderekter-oryn-basaratyn-zhyelerd-basty-funktsiyalary",jpg:"jpg\u002F6308"},{id:350113,name:"Семиуровневая модель OSI",href:"\u002Finformatika\u002Fsemiurovnevaya-model-osi-2",jpg:"jpg\u002F350113"},{id:237022,name:"Циклы Turbo Pascal",href:"\u002Finformatika\u002Ftsikly-turbo-pascal",jpg:"jpg\u002F237022"},{id:96077,name:"Завдання: Написати програму, яка переводить числа з арабської системи в римську",href:"\u002Finformatika\u002Fzavdannya-napisati-programu-yaka-perevodit-chisla",jpg:"jpg\u002F96077"},{id:132339,name:"Выполнение алгоритмов исполнителя",href:"\u002Finformatika\u002Fvypolnenie-algoritmov-ispolnitelya",jpg:"jpg\u002F132339"},{id:23866,name:"Маркування споживчих товарів",href:"\u002Finformatika\u002Fmarkuvannya-spozhivchih-tovarv",jpg:"jpg\u002F23866"},{id:398546,name:"Информационные системы",href:"\u002Finformatika\u002Finformatsionnye-sistemy-12",jpg:"jpg\u002F398546"},{id:317736,name:"ERP - система SAP: архитектура (лекция 12)",href:"\u002Finformatika\u002Ferp-sistema-sap-arhitektura-lektsiya-12",jpg:"jpg\u002F317736"},{id:269891,name:"Архитектура ЭВМ. Устройства вывода",href:"\u002Finformatika\u002Farhitektura-evm-ustroystva-vyvoda",jpg:"jpg\u002F269891"},{id:581795,name:"Использование игровой среды программирования Scratch, как интуитивного программирования, при изучении раздела Алгоритмизация",href:"\u002Finformatika\u002Fispolzovanie-igrovoy-sredy-programmirovaniya-scratch-kak-1",jpg:"jpg\u002F581795"},{id:582672,name:"Язык программирования Python",href:"\u002Finformatika\u002Fyazyk-programmirovaniya-python-8",jpg:"jpg\u002F582672"},{id:346883,name:"Розроблення модуля Управління бізнес-процесами оренди автомобілів на основі Web-технологій",href:"\u002Finformatika\u002Frozroblennya-modulya-upravlnnya-bznes-protsesami-orendi",jpg:"jpg\u002F346883"},{id:540538,name:"семинар Здоровьесберегающие технологии на уроках информатики",href:"\u002Finformatika\u002Fseminar-zdorovesberegayushchie-tehnologii-na-urokah-informatiki",jpg:"jpg\u002F540538"},{id:423601,name:"Подготовка файлов к печати. Форматы файлов, цветовые раскладки и разница между векторной и растровой графикой",href:"\u002Finformatika\u002Fpodgotovka-faylov-k-pechati-formaty-faylov",jpg:"jpg\u002F423601"},{id:245537,name:"Рекурсия в программировании",href:"\u002Finformatika\u002Frekursiya-v-programmirovanii",jpg:"jpg\u002F245537"}],navigation:{next:"\u002Fmenedzhment\u002Fobshchiy-menedzhment-istoriya-menedzhmenta",next_name:"Общий менеджмент. История менеджмента",prev:"\u002Fistoriya\u002Frazvitie-perevodcheskoy-deyatelnosti",prev_name:"Развитие переводческой деятельности"}}},categories:{result:[{id:H,ordering:b,name:"Без категории",pseudoname:"uncategorized"},{id:144,ordering:b,name:"Бизнес",pseudoname:"biznes"},{id:146,ordering:b,name:"Образование",pseudoname:"obrazovanie"},{id:149,ordering:b,name:"Финансы",pseudoname:"finansy"},{id:150,ordering:b,name:"Государство",pseudoname:"gosudarstvo"},{id:152,ordering:b,name:"Спорт",pseudoname:"sport"},{id:154,ordering:b,name:"Армия",pseudoname:"armiya"},{id:156,ordering:b,name:"Культурология",pseudoname:"kulturologiya"},{id:157,ordering:b,name:"Еда и кулинария",pseudoname:"eda-i-kulinariya"},{id:158,ordering:b,name:"Лингвистика",pseudoname:"lingvistika"},{id:163,ordering:b,name:"Черчение",pseudoname:"cherchenie"},{id:164,ordering:b,name:"Физкультура",pseudoname:"fizkultura"},{id:165,ordering:b,name:"ИЗО",pseudoname:"izo"},{id:166,ordering:b,name:"Психология",pseudoname:"psihologiya"},{id:116,ordering:H,name:"Английский язык",pseudoname:"angliyskiy-yazyk"},{id:108,ordering:2,name:"Астрономия",pseudoname:"astronomiya"},{id:104,ordering:3,name:"Алгебра",pseudoname:"algebra"},{id:106,ordering:4,name:"Биология",pseudoname:"biologiya"},{id:142,ordering:5,name:"География",pseudoname:"geografiya"},{id:141,ordering:6,name:"Геометрия",pseudoname:"geometria"},{id:123,ordering:7,name:"Детские презентации",pseudoname:"detskie-prezentatsii"},{id:107,ordering:8,name:G,pseudoname:"informatika"},{id:109,ordering:9,name:"История",pseudoname:"istoriya"},{id:139,ordering:10,name:"Литература",pseudoname:"literatura"},{id:119,ordering:11,name:"Маркетинг",pseudoname:"marketing"},{id:114,ordering:12,name:"Математика",pseudoname:"matematika"},{id:138,ordering:h,name:"Медицина",pseudoname:"medetsina"},{id:118,ordering:14,name:"Менеджмент",pseudoname:"menedzhment"},{id:137,ordering:15,name:"Музыка",pseudoname:"muzyka"},{id:136,ordering:16,name:"МХК",pseudoname:"mhk"},{id:130,ordering:17,name:"Немецкий язык",pseudoname:"nemetskiy-yazyk"},{id:105,ordering:18,name:"ОБЖ",pseudoname:"obzh"},{id:133,ordering:19,name:"Обществознание ",pseudoname:"obshchestvoznanie"},{id:132,ordering:20,name:"Окружающий мир ",pseudoname:"okruzhayushchiy-mir"},{id:131,ordering:21,name:"Педагогика ",pseudoname:"pedagogika"},{id:129,ordering:22,name:"Русский язык",pseudoname:"russkiy-yazyk"},{id:128,ordering:24,name:"Технология",pseudoname:"tehnologiya"},{id:127,ordering:25,name:"Физика",pseudoname:"fizika"},{id:126,ordering:26,name:"Философия",pseudoname:"filosofiya"},{id:125,ordering:27,name:"Химия",pseudoname:"himiya"},{id:124,ordering:29,name:"Экология",pseudoname:"ekologiya"},{id:121,ordering:30,name:"Экономика",pseudoname:"ekonomika"},{id:120,ordering:31,name:"Юриспруденция",pseudoname:"yurisprudentsiya"}]}},state:{},_errors:{},serverRendered:e,config:{public:{SITE_NAME:I,SITE_HOST:"mypreza.com",SITE_LANG:J,API_BASE_URL:"https:\u002F\u002Fmypreza.com\u002Fapi\u002F",pwaManifest:{name:I,short_name:a,description:a,lang:J,start_url:"\u002F?standalone=true",display:"standalone",background_color:j,theme_color:"#000000",icons:[{src:"\u002F_nuxt\u002Ficons\u002F64x64.f2a6e93d.png",type:d,sizes:K,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F64x64.maskable.f2a6e93d.png",type:d,sizes:K,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F120x120.f2a6e93d.png",type:d,sizes:L,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F120x120.maskable.f2a6e93d.png",type:d,sizes:L,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F144x144.f2a6e93d.png",type:d,sizes:M,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F144x144.maskable.f2a6e93d.png",type:d,sizes:M,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F152x152.f2a6e93d.png",type:d,sizes:N,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F152x152.maskable.f2a6e93d.png",type:d,sizes:N,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F192x192.f2a6e93d.png",type:d,sizes:O,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F192x192.maskable.f2a6e93d.png",type:d,sizes:O,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F384x384.f2a6e93d.png",type:d,sizes:P,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F384x384.maskable.f2a6e93d.png",type:d,sizes:P,purpose:g},{src:"\u002F_nuxt\u002Ficons\u002F512x512.f2a6e93d.png",type:d,sizes:Q,purpose:f},{src:"\u002F_nuxt\u002Ficons\u002F512x512.maskable.f2a6e93d.png",type:d,sizes:Q,purpose:g}]},yandexMetrika:{id:"85004146",metrikaUrl:"https:\u002F\u002Fmc.yandex.ru\u002Fmetrika\u002Ftag.js",accurateTrackBounce:e,childIframe:c,clickmap:c,defer:c,useRuntimeConfig:e,trackHash:c,trackLinks:e,type:b,webvisor:c,triggerEvent:c,consoleLog:e,partytown:c,isDev:c}},app:{baseURL:"\u002F",buildAssetsDir:"\u002F_nuxt\u002F",cdnURL:a}},pinia:{app:{meta:{h1:l,main_text:a,main_title:m,main_description:n,main_keywords:o,main_image:a},app:{logo_image:p,logo_image_width:q,logo_image_height:r,logo_text:a,image_width_full:s,image_width_min:t,recaptcha_key:u,yandex_search:v,ya_context:c,banner_1:a,banner_2:a,banner_3:a,banner_4:a,banner_5:a,banner_6:a,banner_7:a,banner_8:a,banner_9:a,banner_10:a,email:w,footer_before:a,footer:a,dark_theme:c,strategy:{image_alt_words:h,item_slide_header:x,item_images:y,item_images_tag:z,item_words_h3:c,item_words_tag:A,item_words_1:h,routing:B,item_slide_skipping:C,item_download_timeout:D,item_slider_width:E,item_show_pdf:e,item_show_contents:e,item_show_filename:e},colors:{header_text:j,header_bg:i,accent:i}},social:F,token:a}}}}("",0,false,"image\u002Fpng",true,"any","maskable",13,"#d53032","#ffffff","Основные понятия в Web-разработке","Учебные презентации","Презентации в PowerPoint на разные темы","Презентации, проекты, доклады в PowerPoint на разные темы для учебы","Презентация, на тему, урок, класс, PowerPoint, скачати презентацію, фон, шаблон, доклад, проект.","images\u002Fdata\u002Flogo.png",185,40,720,480,"6LeioWIpAAAAAGqMN4KqMVIkekcMW7fBKHjXCd-a","2503267","[e-mail]","h3a","text","none","h3","category","both",80,800,"\u003Cscript src=\"\u002F\u002Fyastatic.net\u002Fes5-shims\u002F0.0.2\u002Fes5-shims.min.js\"\u003E\u003C\u002Fscript\u003E\r\n\u003Cscript src=\"\u002F\u002Fyastatic.net\u002Fshare2\u002Fshare.js\"\u003E\u003C\u002Fscript\u003E\r\n\u003Cdiv class=\"ya-share2\" data-services=\"collections,gplus,vkontakte,facebook,odnoklassniki,gplus,twitter,moimir\" data-counter=\"\"\u003E\u003C\u002Fdiv\u003E","Информатика",1,"Mypreza","ru","64x64","120x120","144x144","152x152","192x192","384x384","512x512"))</script><script type="module" src="/_nuxt/entry.0d6add34.js" crossorigin></script></body>
</html>