Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net Что такое CSS Несколько CSS свойств Использование каскадной таблицы.

Презентация:



Advertisements
Похожие презентации
Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net HTML элемент Вид элемента Атрибуты элементов Структура HTML документа.
Advertisements

Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net Работа с JavaScript в браузере Первый взгляд Переменные и типы Функции.
CSS Cascading Style Sheets. Типы стилей: 1. Стиль браузера 2. Стиль автора 3. Стиль пользователя.
Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net Что такое Razor Типизация представления Мастер страница _ViewStart.cshtml.
CSS валидатор
Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net Что такое AJAX Сокращенные методы: $.get, $.post,.load(), $.getScript,
Динамический HTML (dynamic HTML или DHTML) не является каким-то особым языком разметки страниц. Это всего лишь термин, применяемый для обозначения HTML-страниц.
CSS: основные понятия и особенности. Способы добавления стилей на Веб-страницу. Использование стилей при создании сайта.
Cascading Style Sheets каскадные таблицы стилей CSS-код – это список инструкций для браузера, – как и где отображать элементы веб-страницы, написанный.
Каскадные таблицы стилей CSS. Стиль – набор параметров, задающий внешнее представление объекта. Таблица стилей – это инструмент языка html, предоставляющий.
1 Cascading Style Sheets каскадные таблицы стилей 2.
4.3 Каскадные таблицы стилей. Каскадные таблицы стилей (Cascading Style Sheets, CSS) способ оформления страниц HTML, позволяющий с помощью параметров.
Введение в CSS. Базовый синтаксис CSS селектор { свойство1: значение; свойство2: значение; } селектор некоторое имя стиля, для которого добавляются параметры.
CSS – Cascading Style Sheets (Каскадные таблицы стилей) «Создание Web-сайтов»
Таблицы стилей Язык HTML. Каскадные таблицы стилей CSS CSS (от английского Cascading Style Sheets). Таблицы стилей позволяют разделить смысловое содержимое.
Лекция 9 Тема «Каскадные таблицы стилей » Преподаватель: Халелова Е. Н.
CSS Cascading Style Sheet. CSS это правила как должен выглядеть HTML. Существуют три типа правил CSS 1. HTML селектор - текстовая часть HTML тэга. P селектор.
ЛЕКЦИЯ 2-05 Ссылки и навигация. Введение Без ссылок Web-пространство потеряет смысл. Ссылки позволяют отслеживать информацию, переходя с одной Web-страницы.
CSSCSS (англ. Cascading Style Sheets каскадные таблицы стилей) язык описания внешнего вида документа, написанного с использованием языка разметки.англ.
Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net Ненавязчивый JavaScript Ajax расширенные методы AjaxOptions InsertionMode.
Транксрипт:

Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net Что такое CSS Несколько CSS свойств Использование каскадной таблицы стилей Каскады и наследование стилей Селекторы Единицы измерения Первый взгляд на CSS

Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net Каскадные таблицы стилей (CSS) являются средством, с помощью которого вы определяете презентацию (внешний вид и форматирование) HTML документов Далее покажу, как создавать и применять CSS стили, почему они называются каскадными таблицами стилей Что такое CSS

Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net CSS стиль состоит из одного или нескольких объявлений, разделенных точкой с запятой. Каждое объявление состоит из свойства CSS и значения этого свойства, разделенных двоеточием background-color:grey; color:white background-color и color – свойства grey и white – значения background-color:grey и color:white – объявление

Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net background-color – Устанавливает для элемента цвет заднего фона border – Определяет рамку, которая окружает элемент color – Устанавливает для элемента цвет переднего плана font-size – Устанавливает размер шрифта для текста элемента height – Устанавливает высоту элемента padding – Определяет количество пространства (размер пустого места) между содержимым элемента и его рамкой text-decoration – Определяет декор (украшение), применяемое к тексту элемента, включая подчеркивание width – Устанавливает ширину элемента Примеры CSS свойств

Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net 1.Применение напрямую к элементу через атрибут style Посетите smarly.net 2.Применение через HTML элемент style a { background-color: grey; color: white; } 3.Применение через присоединенный файл Применение стиля

Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net Браузерные стили (более известные как стили пользовательского агента) являются стилями по умолчанию, которые браузер применяет к элементу, если не были указаны другие стили. Эти стили немного различаются у разных браузеров, но они, как правило, в целом аналогичны. Браузерные стили

Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net Большинство браузеров позволяют пользователям определять свои собственные таблицы стилей. Стили, которые содержатся в этих таблицах, называются пользовательскими стилями. Google Chrome – редактирование C:\Users\Administrator\AppData\Local\Google\Chrome\User Data\Default\User StyleSheets\Custom.css Mozilla Firefox – добавление файла в папку профиля\chrome\userContent.css Пользовательские стили

Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net Порядок поиска значения свойств: 1.Внутренние стили (стили, которые определяются для элемента с помощью глобального атрибута style ) 2.Встроенные стили (стили, которые определены элементом style ) 3.Внешние стили (стили, которые импортируются при помощи элемента link ) 4.Пользовательские стили (стили, которые были определены пользователем) 5.Браузерные стили (стили по умолчанию, которые применяются браузером) Каскадирование стилей

Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net Приоритет отдается значению с объявлением !important Для обычных значений авторские стили используются прежде чем пользовательские стили, но это порядок меняется, когда речь идет о значениях !important. Изменение порядка при помощи !important

Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net * – выбирает все элементы – выбирает элементы определенного типа. – выбирает элементы определенного класса. – выбирает элементы определенного типа, которые являются членами определенного класса # – выбирает элементы с конкретным значением атрибута id Селекторы

Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net [attr] – выбирает элементы с атрибутом attr, независимо от значения, данного атрибуту [attr="val"] – выбирает элементы с атрибутом attr, значение этого атрибута = val [attr^="val"] – выбирает элементы с атрибутом attr, значение этого атрибута начинается со строки val [attr$="val"] – выбирает элементы с атрибутом attr, значение этого атрибута заканчивается строкой val [attr*="val"] – выбирает элементы с атрибутом attr, значение этого атрибута содержит строку Выбор по атрибуту

Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net – выбирает элементы, которые соответствуют второму селектору и которые являются потомками элементов, соответствующих первому селектору > – выбирает элементы, которые соответствуют второму селектору и которые являются дочерними элементами для элементов, соответствующих первому селектору Выбор по виду отношений

Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net Абсолютные величины in – дюймы cm – сантиметры mm – миллиметры pt – пункты (1 пункт равен 1/72 дюйма) pc – пики (1 пика равна 12 пунктам) Относительные величины em – относительная к размеру шрифта элемента ex –относительная к размеру символа x px – число CSS пикселей (предположительно на экране 96dpi) % – процентное отношение к другой величине Единицы измерения

Онлайн курс «Web разработка на базе ASP.NET MVC» на study.smarly.netstudy.smarly.net Материал для прочтения PowerPoint презентация Видео урок Материал