HTML5 и CSS3: первые шаги

{title}

HTML (HyperText Markup Language) или язык гипертекстовой разметки, является стандартом, используемым для разработки веб-страниц, это язык, основанный на метках, который структурирует информацию на основе иерархии содержимого. В случае, если только HTML не предоставляет графические характеристики представленной информации, он организует ее только таким образом, что имеет логический порядок чтения.
С другой стороны, CSS (Cascading Style Sheet) или каскадные таблицы стилей - это язык, используемый для определения и создания представления структурированного документа, написанного на HTML, он отвечает за разработку спецификации таблиц стилей, которая будет служить стандартом для браузеры
В этом уроке мы представим основную структуру документа HTML5, наиболее известные теги и иерархический порядок их объявления. В свою очередь, мы объясним взаимосвязь между HTML5 и CSS3, то, как они могут быть связаны, структуру объявлений, сделанных в CSS3, и графические атрибуты, которые могут быть заданы в документе HTML.
Для примеров, которые мы собираемся сделать, необходимо иметь редактор кода, в нашем случае выбранный редактор - Dreamweaver CC 2014, в учебном пособии Основные основы Dreamweaver CS6: Знание рабочей среды описывает характеристики приложения, которые продолжают оставаться то же самое, несмотря на разницу в своих версиях
1. Структура документа HTML5

{title}


A) Этот ярлык указывает версию, которую мы будем использовать в документе, в данном случае это версия 5 HTML.
Б) Обозначает открытие HTML-документа, это первая объявленная метка.
C) Он может включать в себя заголовок документа, сценарии, стили, метаинформацию и другие.
D) Предоставить метаданные о документе HTML. Метаданные не будут отображаться на странице, они будут только проанализированы как прикрепленная информация. Элементы обычно используются для указания описания страницы, ключевых слов, автора документа и других. В примере, показанном на рисунке, мы использовали атрибут charset для определения набора символов, в котором будет отображаться страница, charset = "utf-8" в случае испанского языка.
E) Это позволяет нам назначить имя страницы, которая будет отображаться в браузерах.
F) Подавляющему большинству тегов HTML требуется вступительное и заключительное утверждение:
 Содержимое тега 
В этом случае показанное изображение закрывает тег head
G) Все найденное в этом элементе будет отображаться браузером, то есть внутри этого ярлыка мы будем обозначать весь визуальный контент нашего HTML-документа.
H) Так же, как объяснено в разделе F, это закрытие этикетки
I) Так же, как объяснено в разделе F, это закрытие этикетки
Структура документа CSS3

{title}


A) .class: все объявления, начинающиеся с точки, относятся к типу класса, его графические характеристики могут быть применены к любому тегу HTML.
Б) #Id: Объявления, которые начинаются со знака цифры, указывают, что он имеет тип ID. И классы, и идентификаторы используются для указания того, какие графические атрибуты мы хотим предоставить нашему HTML-контенту. Однако различия между этими двумя типами утверждений заключаются в следующем:
Идентификаторы уникальны:
- Каждый элемент может иметь только один идентификатор.
- Каждая страница может иметь только один элемент с таким идентификатором.
Наш HTML-код не пройдет проверку, если один и тот же идентификатор используется более чем в одном элементе.
Классы не уникальны:
- Вы можете использовать один и тот же класс в нескольких элементах.
- Несколько классов могут быть использованы в одном элементе.
Любой стиль, который необходимо применить к нескольким объектам на странице, должен выполняться с помощью класса. Важно отметить, что все, что объявлено в документах CSS, чувствительно к использованию прописных и строчных букв.
C) {Открытие ключа, с которого начинается объявление атрибутов.
D) } Ключ, закрывающий объявления, сделанные классу или идентификатору.
E) Структура атрибута: после объявления атрибута необходимо указать значение атрибута, в примере, показанном на рисунке, мы назначаем высоту 600 пикселей для #Id.
Для разделения атрибутов и их значений используется точка с запятой; Как показано на рисунке.
Это, в общем, общие характеристики структуры HTML- кода, необходимые теги и способы их сортировки. В случае CSS типы объявлений и их общая структура. Обладая этими знаниями, мы будем готовы сделать наш первый HTML-код и дать графические характеристики меткам.

  • 0