WEB start
Компьютеры. Интернет. Профессиональное обучение. 055-966-10-17
Наши преимущества
- Наши программы обучения ориентированы на конкретного слушателя. Вы можете обучаться по одной из предложенных Вам программ, а можете самостоятельно составить, откорректировать, откорректировать свою персональную программу обучения. Преподаватель, консультант помогают Вам сориентироваться в материале курса при выборе программы обучения.
- Обучение индивидуальное. Преподаватель проводит занятие только для Вас, ориентируясь на Ваши возможности, предыдущие знания и опыт, скорость восприятия нового материала.
- Вы учитесь в удобное для Вас время, в удобной для Вас форме, может быть выбран гибкий график занятий, в соответствии с Вашими возможностями и пожеланиями.
- Обучение проводится дистанционно. Вы можете обучаться, сидя за Вашим компьютером дома или на работе, не тратя время на поездки к месту обучения.
WEB основы
-
CSS
-
HTML
-
JavaScript
- JavaScript - объекты
- DOM объекты браузера
- DOM - объекты CSS
- DOM объект Window
- JavaScript - операторы языка
- JavaScript - массивы (Array)
- JavaScript - работа со строками
- DOM объект Document
- DOM объект - Element
- JavaScript регулярные выражения
- JavaScript - объект Date
- DOM - обработка событий (Events)
- Программирование на JavaScript, DOM
- JavaScript AJAX
- JavaScript - объект Math
- DOM объект - window
Регистрация на сайте
Дополнительные материалы
- API WEB - уведомлений (Notifications)
- CSS - шрифты
- CSS3 адаптивные блоки (Flex Box Model)
- HTML5 - элемент CANVAS, рисование
- HTML5 семантические элементы
- Joomla, компонент Sourcerer
- Visual Studio Code для HTML, CSS, SASS, JavaScript
- WordPress - дочерние темы
- Вставка видео в HTML документ
- Построение многоязычных сайтов на CMS WordPress
- Создание шаблонов для Joomla 3.x
CSS стили в HTML
Стили в HTML документе - CSS
CSS - это акроним от Cascading Style Sheets.
CSS это язык, который описывает стиль HTML-документа, его внешний вид. HTML задаёт структуру документа, а CSS описывает, как должны отображаться HTML элементы на экране браузера.
Определения
Свойство (property) - название стиля.
Значение (value) - значение свойства.
Селектор (selector) - переключатель, идентификатор набора стилей (блока стилей)
Блок стилей (block) - набор описаний стилей (declarations), который заключается в фигурные скобки ({}).
Правило (rule или набор правил - rule set) - селектор стиля плюс блок стилей.
Декларация (declaration ) - строка-описание стиля. Внутри одного блока (между фигурными скобками) может находиться одна декларация или несколько, разделённых символом точка с запятой (;). Декларация состоит из свойства (property), после которого ставится двоеточие (:) после этого символа - значение этого свойства (value ), после этого - символ точка с запятой (;).
Лист стилей (StyleSheet) - это один набор правил. Он может ограничиваться тегами <STYLE></STYLE> , или импортироваться из какого-либо файла директивами @import или тегом <LINK>.
Документ может использовать один или несколько листов стилей.
Приоритет при этом у каждого последующего листа стилей выше, чем у предыдущего. То есть листы стилей срабатывают в том порядке, в котором они встретились в HTML - страничке.
Нивысший приоритет у стилей, заданных атрибутом style внутри тега.
Пример
Правило
SPAN.text {
display :inline-block;
background-color :red;
min-height :50px;
width :50%;
margin :20px;
padding :20px 30px 35px 15px ;
}
Селектор
SPAN.text
Свойства
display
background-color
min-height
width
margin
padding
Декларации стилей
display :inline-block;
background-color :red;
min-height :50px;
width :50%;
margin :20px;
padding :20px 30px 35px 15px ;
Блок
{
display :inline-block;
background-color :red;
min-height :50px;
width :50%;
margin :20px;
padding :20px 30px 35px 15px ;
}
Использование стилей
Способы назначения стилей
Приоритеты стилей. Наследование стилей. Простые селекторы. Отладка стилей в отладчике Google ChromeСвойства стилей
ПодробнееЕдиницы измерения для значений
ПодробнееЦвет. Способы задания цвета.
ПодробнееБлоки, элементы
Фон. Границы. Тень. Параметры блоков. Отступы элементов. Схема блока. Свойства float, clear.CSS3 Flexible Box Model
ПодробнееСпособы позиционирования элементов
Абсолютное и относительное позиционирование. Свойство position - absolute, relative. Точное размещение блочных элементов в окне браузера (box model), размеры блока, абсолютные и относительные координаты. Наложение слоев, свойство z-index, прозрачность. Управление видимостью слоя и видимостью содержания слоя.CSS Селекторы - подробнее
Псевдоклассы. Псевдоэлементы.Работа с текстом
Стили текста (text, font, @font-face ). Free Google fonts.Дополнительные CSS директивы - @ - rules
- @import: импортирует стили из файла
- @charset задаёт кодировку
- @font-face задаёт шрифт
- @media, @support - позволяют модифицировать CSS таблицы в зависимости от устройства вывода - Подробнее - CSS3 media queries
- !important увеличивает приоритет CSS правила
Трансформации, анимация
ПодробнееCSS функции
Подробнее