Изменены ссылки на заголовки внутри файлов
This commit is contained in:
LeterZP
@@ -1,53 +1,53 @@
|
||||
## Содержание
|
||||
- [Введение](#Введение)
|
||||
- [Клиент-серверное взаимодействие. Протокол HTTP](#Клиент-серверное%20взаимодействие.%20Протокол%20HTTP)
|
||||
- [HTTP](#HTTP)
|
||||
- [Структура запроса HTTP](#Структура%20запроса%20HTTP)
|
||||
- [Структура ответа HTTP](#Структура%20ответа%20HTTP)
|
||||
- [Методы HTTP](#Методы%20HTTP)
|
||||
- [Коды состояния](#Коды%20состояния)
|
||||
- [Заголовки HTTP](#Заголовки%20HTTP)
|
||||
- [Кеширование](#Кеширование)
|
||||
- [URI, URN и URL](#URI,%20URN%20и%20URL)
|
||||
- [REST](#REST)
|
||||
- [Разметка страниц. Язык HTML](#Разметка%20страниц.%20Язык%20HTML)
|
||||
- [HTML](#HTML)
|
||||
- [Структура HTML-документа](#Структура%20HTML-документа)
|
||||
- [HTML-формы](#HTML-формы)
|
||||
- [HTML5](#HTML5)
|
||||
- [Браузер](#Браузер)
|
||||
- [DOM](#DOM)
|
||||
- [Стилизация страниц. Основы CSS](#Стилизация%20страниц.%20Основы%20CSS)
|
||||
- [CSS](#CSS)
|
||||
- [Источники CSS](#Источники%20CSS)
|
||||
- [Структура CSS](#Структура%20CSS)
|
||||
- [Приоритеты стилей](#Приоритеты%20стилей)
|
||||
- [LESS & Sass / SCSS](#LESS%20&%20Sass%20/%20SCSS)
|
||||
- [LESS](#LESS)
|
||||
- [Sass](#Sass)
|
||||
- [SCSS](#SCSS)
|
||||
- [[#Введение]]
|
||||
- [[#Клиент-серверное взаимодействие. Протокол HTTP]]
|
||||
- [[#HTTP]]
|
||||
- [[#Структура запроса HTTP]]
|
||||
- [[#Структура ответа HTTP]]
|
||||
- [[#Методы HTTP]]
|
||||
- [[#Коды состояния]]
|
||||
- [[#Заголовки HTTP]]
|
||||
- [[#Кеширование]]
|
||||
- [[#URI, URN и URL]]
|
||||
- [[#REST]]
|
||||
- [[#Разметка страниц. Язык HTML]]
|
||||
- [[#HTML]]
|
||||
- [[#Структура HTML-документа]]
|
||||
- [[#HTML-формы]]
|
||||
- [[#HTML5]]
|
||||
- [[#Браузер]]
|
||||
- [[#DOM]]
|
||||
- [[#Стилизация страниц. Основы CSS]]
|
||||
- [[#CSS]]
|
||||
- [[#Источники CSS]]
|
||||
- [[#Структура CSS]]
|
||||
- [[#Приоритеты стилей]]
|
||||
- [[#LESS & Sass / SCSS]]
|
||||
- [[#LESS]]
|
||||
- [[#Sass]]
|
||||
- [[#SCSS]]
|
||||
## Введение
|
||||
|
||||
В основном все держится на 4 вещах:
|
||||
- [Hypertext Transfer Protocol (HTTP)](#Клиент-серверное%20взаимодействие.%20Протокол%20HTTP) - предназначен для передачи гипертекста между клиентом и сервером
|
||||
- [Hypertext Markup Language (HTML)](#Разметка%20страниц.%20Язык%20HTML) - язык разметки гипертекста
|
||||
- [Cascade StyleSheets (CSS)](#Стилизация%20страниц.%20Основы%20CSS) - язык описания внешнего вида HTML-документов
|
||||
- [[#Клиент-серверное взаимодействие. Протокол HTTP|Hypertext Transfer Protocol (HTTP)]] - предназначен для передачи гипертекста между клиентом и сервером
|
||||
- [[#Разметка страниц. Язык HTML|Hypertext Markup Language (HTML)]] - язык разметки гипертекста
|
||||
- [[#Стилизация страниц. Основы CSS|Cascade StyleSheets (CSS)]] - язык описания внешнего вида HTML-документов
|
||||
- JavaScript - язык для написания динамических сценариев, выполняемых на стороне клиента
|
||||
## Клиент-серверное взаимодействие. Протокол HTTP
|
||||
|
||||
### HTTP
|
||||
|
||||
Сам по себе HTTP - протокол прикладного уровня. В его основе лежит технология "клиент-сервер". Он может использоваться в качестве "транспорта" для других протоколов прикладного уровня. Основной объект манипуляций этого протокола - ресурс, на который указывает [URI](#URI,%20URN%20и%20URL). Обмен сообщениями в этом протоколе идет по схеме "запрос-ответ". Сам по себе протокол не сохраняет состояние (stateless-протокол), поэтому для реализации сессий используется cookies.
|
||||
Сам по себе HTTP - протокол прикладного уровня. В его основе лежит технология "клиент-сервер". Он может использоваться в качестве "транспорта" для других протоколов прикладного уровня. Основной объект манипуляций этого протокола - ресурс, на который указывает [[#URI, URN и URL|URI]]. Обмен сообщениями в этом протоколе идет по схеме "запрос-ответ". Сам по себе протокол не сохраняет состояние (stateless-протокол), поэтому для реализации сессий используется cookies.
|
||||
#### Структура запроса HTTP
|
||||
|
||||
Первая строка запроса HTTP является стартовой, в ней содержится основное описание необходимого действия (команда). При ее составлении через пробел указывают три основные для протокола вещи: [метод](#Методы%20HTTP), [URI](#URI,%20URN%20и%20URL) и версию протокола HTTP (в формате HTTP/Версия).
|
||||
Первая строка запроса HTTP является стартовой, в ней содержится основное описание необходимого действия (команда). При ее составлении через пробел указывают три основные для протокола вещи: [[#Методы HTTP|метод]], [[#URI, URN и URL|URI]] и версию протокола HTTP (в формате HTTP/Версия).
|
||||
|
||||
За первой строкой следует следующий раздел - заголовки. Этот раздел содержит, как ни странно, [заголовки](#Заголовки%20HTTP).
|
||||
За первой строкой следует следующий раздел - заголовки. Этот раздел содержит, как ни странно, [[#Заголовки HTTP|заголовки]].
|
||||
|
||||
Последним разделом запроса является тело (или сущность) сообщения. Чаще всего в запросе тело остается пустым. В теле сообщения может находится что угодно, что необходимо передать с помощью протокола на другую сторону. Вся информация о теле, необходимая другой стороне, должна быть указана в заголовках.
|
||||
#### Структура ответа HTTP
|
||||
|
||||
Ответ мало чем отличается от [запроса](#Структура%20запроса%20HTTP). Единственным отличием является стартовая строка. Эта строка составляется тем же образом, что и стартовая строка запроса, перечисляя через пробел основную информацию запроса: версию протокола HTTP (в формате HTTP/Версия), [код состояния](#Код%20состояния) и пояснение кода состояния. По сути, в пояснении можно указать что угодно, но лучше придерживаться стандартных шаблонов сообщений.
|
||||
Ответ мало чем отличается от [[#Структура запроса HTTP|запроса]]. Единственным отличием является стартовая строка. Эта строка составляется тем же образом, что и стартовая строка запроса, перечисляя через пробел основную информацию запроса: версию протокола HTTP (в формате HTTP/Версия), [[#Код состояния|код состояния]] и пояснение кода состояния. По сути, в пояснении можно указать что угодно, но лучше придерживаться стандартных шаблонов сообщений.
|
||||
#### Методы HTTP
|
||||
|
||||
Методов HTTP довольно много, поэтому перечислим только используемые чаще всего.
|
||||
@@ -55,7 +55,7 @@
|
||||
- GET - получение данных с ресурса (запрос содержимого ресурса)
|
||||
- HEAD - аналог GET, но в ответе не передается (отсутствует) тело
|
||||
- POST - передача данных ресурсу
|
||||
- PUT - загрузка содержимого запроса на указанный [URI](#URI,%20URN%20и%20URL)
|
||||
- PUT - загрузка содержимого запроса на указанный [[#URI, URN и URL|URI]]
|
||||
- DELETE - удаление данных с сервера
|
||||
#### Коды состояния
|
||||
|
||||
@@ -89,7 +89,7 @@
|
||||
> **REST (Representation State Transformer)** - передача состояния представления - подход к архитектуре сетевых протоколов, обеспечивающих доступ к информационным ресурсам. Он описывает взаимодействие между клиентом и сервером, а также между front-end и back-end частями.
|
||||
|
||||
Основные концепции REST:
|
||||
- данные должны передаваться в виде небольшого числа стандартных форматов (к примеру, [HTML](#HTML), [XML](https://ru.wikipedia.org/wiki/XML?ysclid=mu8vgeju1m2168967), [JSON](https://ru.wikipedia.org/wiki/JSON?ysclid=mu8vgmwdcz833033530))
|
||||
- данные должны передаваться в виде небольшого числа стандартных форматов (к примеру, [[#HTML]], [XML](https://ru.wikipedia.org/wiki/XML?ysclid=mu8vgeju1m2168967), [JSON](https://ru.wikipedia.org/wiki/JSON?ysclid=mu8vgmwdcz833033530))
|
||||
- сетевой протокол должен поддерживать кеширование, не должен зависеть от сетевого слоя, не должен сохранять информацию о состоянии между парами "запрос-ответ"
|
||||
|
||||
Существует подход, противоположный REST, который основан на вызове удаленных процедур (RPC - Remote Process Call).
|
||||
@@ -99,31 +99,31 @@
|
||||
|
||||
>**HyperText Markup Language** (HTML) - стандартный декларативный язык разметки документов в интернете.
|
||||
|
||||
В основном, он интерпретируется [браузером](#Браузер) и отображается в виде документа. Изначально, он являлся частным случаем SGML (стандартного обобщенного языка разметки).
|
||||
В основном, он интерпретируется [[#Браузер|браузером]] и отображается в виде документа. Изначально, он являлся частным случаем SGML (стандартного обобщенного языка разметки).
|
||||
|
||||
Этот язык был разработан [Тимом Бернерсом-Ли](https://ru.wikipedia.org/wiki/Бернерс-Ли,_Тим?ysclid=mu8uowzcj46005688) в 1989-1991 годах.
|
||||
#### Структура HTML-документа
|
||||
|
||||
В начале документа всегда находится строка с объявлением версии HTML. Хотя чаще всего для версии [HTML5](#HTML5) это правило игнорируется, так как такой стандарт используется неявно.
|
||||
В начале документа всегда находится строка с объявлением версии HTML. Хотя чаще всего для версии [[#HTML5]] это правило игнорируется, так как такой стандарт используется неявно.
|
||||
|
||||
По синтаксису он очень напоминает [XML](https://ru.wikipedia.org/wiki/XML?ysclid=mu8urdj3jm497572817), и даже существует отдельная нотация [XHTML](https://ru.wikipedia.org/wiki/XHTML?ysclid=mu8urty7p0976864513), которая является частным случаем этого языка. В частности, документ также состоит в основном из элементов, начало и конец которых обозначаются тегами.
|
||||
|
||||
Теги однозначно определяют закрытие или открытие того или иного элемента. Это позволяет вкладывать теги друг в друга, при этом сохраняя строгую структуру. В то же время теги могут быть одинарными (или пустыми) - то есть только открываться, не закрываясь. Также теги могут содержать атрибуты - специальные переменные, указанные в открывающем теге.
|
||||
|
||||
Начало и конец документа обозначаются специальными тегами. Внутри этих тегов должны находится два других тега, которые определяют заголовок и тело документа соответственно.
|
||||
В заголовке чаще всего указывают, помимо самого заголовка, мета-информацию и различные необходимые для работы сайта файлы, к примеру файлы [css](#Стилизация%20страниц.%20Основы%20CSS) или js.
|
||||
В заголовке чаще всего указывают, помимо самого заголовка, мета-информацию и различные необходимые для работы сайта файлы, к примеру файлы [[#Стилизация страниц. Основы CSS|css]] или js.
|
||||
#### HTML-формы
|
||||
|
||||
Основное предназначение форм - обмен данными между пользователем и сервером. Приятной особенностью таких форм является то, что они могут работать без JavaScript.
|
||||
|
||||
Сам HTML-документ может содержать любое число форм, но на сервер одновременно может быть отправлена только одна. При этом вложенные формы запрещены.
|
||||
|
||||
Границы формы в документе, как и границы любого другого элемента, задаются тегами. В атрибутах формы можно отдельно указать [метод HTTP](#Методы%20HTTP) и ссылку, куда отправляется форма. При этом в конце формы обязательно должна находится отдельная кнопка для ее отправки.
|
||||
Границы формы в документе, как и границы любого другого элемента, задаются тегами. В атрибутах формы можно отдельно указать [[#Методы HTTP|метод HTTP]] и ссылку, куда отправляется форма. При этом в конце формы обязательно должна находится отдельная кнопка для ее отправки.
|
||||
#### HTML5
|
||||
|
||||
HTML5 - как следует из названия, пятая версия спецификации языка HTML. Стандарт такого языка был принят в 2014 году (в то время как HTML4 - в 1999 году).
|
||||
|
||||
Конечно, за это время в язык добавили много новых синтаксических особенностей. В первую очередь, изменения были внесены для более удобного управления мультимедийным содержимым страницы. Это включает в себя добавление таких тегов, как аудио и видео. Несмотря на то, что они сами по себе достаточно просты (в них присутствует всего три кнопки - старт, стоп и перемотка), они универсальны и работают на любом [браузере](#Браузер).
|
||||
Конечно, за это время в язык добавили много новых синтаксических особенностей. В первую очередь, изменения были внесены для более удобного управления мультимедийным содержимым страницы. Это включает в себя добавление таких тегов, как аудио и видео. Несмотря на то, что они сами по себе достаточно просты (в них присутствует всего три кнопки - старт, стоп и перемотка), они универсальны и работают на любом [[#Браузер|браузере]].
|
||||
|
||||
Помимо этого были добавлены новые семантические теги - замена для стандартных и универсальных. В основном они редко где используются, но иногда могут помочь в решении проблем доступности (к примеру, для слепых) или для более точного пояснения к содержимому тега.
|
||||
|
||||
|
||||
Reference in New Issue
Block a user