Студопедия

Главная страница Случайная страница

Разделы сайта

АвтомобилиАстрономияБиологияГеографияДом и садДругие языкиДругоеИнформатикаИсторияКультураЛитератураЛогикаМатематикаМедицинаМеталлургияМеханикаОбразованиеОхрана трудаПедагогикаПолитикаПравоПсихологияРелигияРиторикаСоциологияСпортСтроительствоТехнологияТуризмФизикаФилософияФинансыХимияЧерчениеЭкологияЭкономикаЭлектроника






  • Как продвинуть сайт на первые места?
    Вы создали или только планируете создать свой сайт, но не знаете, как продвигать? Продвижение сайта – это не просто процесс, а целый комплекс мероприятий, направленных на увеличение его посещаемости и повышение его позиций в поисковых системах.
    Ускорение продвижения
    Если вам трудно попасть на первые места в поиске самостоятельно, попробуйте технологию Буст, она ускоряет продвижение в десятки раз, а первые результаты появляются уже в течение первых 7 дней. Если ни один запрос у вас не продвинется в Топ10 за месяц, то в SeoHammer за бустер вернут деньги.
    Начать продвижение сайта
  • Создание структуры html документа






    МЕТОДИЧЕСКИЕ УКАЗАНИЯ

     

    по дисциплине

    «Информационные системы в профессиональной деятельности»

     

    на тему:

    «ЯЗЫК HTML»

     

    Преподаватель:

    Никульникова М. А.

     

     

    г. Краснодар

    2012 г.


    Создание структуры html документа

    < HTML> … < /HTML> говорит браузеру, что далее будет текст, написанный на HTML-языке. Атрибуты тега < HTML>:

    dir – определяет направление символов: ltr — слева направо; rtl — справа налево

    lang – определяет язык отображаемого документа

    title – задает всплывающую подсказку.

    version – версия HTML, под которую создан документ.

    xmlns – Объявляет пространство имен для тегов в HTML документе

    xml: lang – идентификатор языка

    < HEAD> … < /HEAD> тег-контейнер, заголовок документа, содержит информацию о текущем документе: название документа, инструкции браузеру по отображению страницы, ключевые слова и описание страницы для поисковых машин, подключения внешних файлов таблиц стилей и скриптов, описания внутренних таблиц стилей и скриптов. Размещается внутри тега < HTML>. Атрибуты тега < HEAD>:

    dir – определяет направление символов: ltr — слева направо; rtl — справа налево

    lang – определяет язык отображаемого документа

    profile – указывает расположение профилей метаданных, разделенных пробелами

     

    < TITLE> … < /TITLE> – это заголовок окна страницы, который отображается в браузере. Размещается внутри тега < HEAD>. Содержимое тега отображается: в заголовке окна; в результатах запроса в поисковых системах; в названии закладки, при добавлении страницы в избранное. Атрибуты тега < TITLE >:

    dir – определяет направление символов: ltr — слева направо; rtl — справа налево

    lang – определяет используемый язык

    < LINK> одиночный тег, необходим для подключения внешних файлов. Размещается внутри тега < HEAD>. Например, если вы будете использовать каскадную таблицу стилей, то ее удобнее хранить в отдельном файле и подключать этот файл ко всем страницам сайта. У тега < LINK > несколько атрибутов:

    charset – определяет набор символов, используемый браузером для отображения страницы, на которую оказывает ссылка

    class – определяет имя используемого класса

    dir – определяет направление символов: ltr — слева направо; rtl — справа налево

    disabled – флаг. Определяет элемент как неактивный.

    href – указывает URL-адрес подключаемого файла.

    hreflang – определяет используемый язык в документе, на который указывает ссылка

    id – уникальный идентификатор

    lang – определяет язык отображаемого документа

    media – усторойство, для которого применяется стиль оформления: all — все устройства; braille — устройства для слепых на основе системы Брайля; screen — экран (по умолчанию); print — устройство печати; projection — проектор; speech — синтезатор голоса;

    onclick – щелчок на элементе;

    ondblclick – двойной щелчок на элементе;

    onkeydown – нажатие клавиши, когда элемент имеет фокус;

    onkeypress – нажатие и освобождении клавиши, когда элемент имеет фокус;

    onkeyup о – вобождение ранее нажатой клавиши, когда элемент имеет фокус;

    onmousedown - нажатие кнопки мыши, когда элемент имеет фокус

    onmousemove – движение указателя мыши, когда элемент имеет фокус

    onmouseout – смещение указателя мыши с элемента

    onmouseover – помещение указателя мыши на элемент

    onmouseup – освобождение ранее нажатой кнопки мыши, когда элемент имеет фокус

    rel – указывает на тип отношения данного документа к внешнему: stylesheet — указывает на файл, содержащий таблицу стилей (CSS) для текущего документа; home — указывает на заглавную страницу сайта; toc, contents — указывают на файл, содержащий оглавление документа; index — указывает на файл, содержащий информацию для индексного поиска по текущему документу; glossary — указывает на файл, содержащий перечень терминов, относящихся к текущему документу; copyright — указывает на страницу сайта, в которой говорится об авторских правах; child — указывает на «дочернюю» страницу; next — указывает на следующую страницу в последовательности документов; previous — указывает на предыдущую страницу в последовательности документов; last, end — указывает на последнюю страницу в последовательности документов; first — указывает на первую страницу в последовательности документов; help — указывает на страницу с подсказкой

    rev – определяем обратную связь целевого документа к текущему

    style – задает встроенную таблицу стилей

    target – имя окна или фрейма. В качестве аргумента используется имя окна или фрейма. Зарезервированные имена: _blank — откроет документ в новом окне; _parent — откроет документ во фрейме-родителе. Если такого нет, откроет в текущем окне; _ top — отменяет все фреймы и загружает страницу в полном окне браузера, если фремов нет, откроет в текущем окне; _self — откроет в текущем окне (по умолчанию)

    title – всплывающая подсказка

    type – указывает тип и параметры присоединенной таблицы стилей, т.е. MIME-тип объекта, указанного в параметре href.

    Пример. Подключаем файл стилей < link href=" css/main.css" rel=" stylesheet" type=" text/css" media=" screen" />

     

    < META> содержит метаданные – техническое описание документа в виде пар «имя-значение». Размещается внутри тега < HEAD>. Служит для идентификации свойств документа (например, автора, конечной даты использования, списка ключевых слов и т.д.) и установки значений этих свойств. Атрибуты тега < META>:

    content – устанавливает значение параметра, заданного с помощью name или http-equiv

    dir – определяет направление символов: ltr — слева направо; rtl — справа налево

    http-equiv – конвертируется в формат заголовка ответа HTTP

    lang – определяет язык отображаемого документа

    name – имя метатега

    scheme – название схемы для интерпретации значения свойства

    Пример. Указание кодировки страницы для русского текста в кодировке Windows < meta http-equiv=" Content-Type" content=" text/html; charset=UTF-8" >
    Пример. Указание ключевых слов страницы (используется при оптимизации страниц) < meta http-equiv=" KEYWORDS" content=" тег, структура html, заголовок страницы" >
    Пример. Указание краткого описания страницы: < meta http-equiv=" DESCRIPTION" content=" Описание структура html и элементов заголовка" >

    < SCRIPT> … < /SCRIPT> используются для подключения внешних файлов скриптов. Это позволяет оптимизировать код страниц. Размещается внутри тега < HEAD> или < BODY>. Например, если вы используете функции java script для большинства своих страниц, то поместив эти функции на отдельную страницу - *.js, с помощью тега < SCRIPT > можно указать путь к этой страницы. Это повышает читабельность кода и ускоряет загрузку страниц. У этого тега несколько атрибутов:

    harset – набор символов ресурса

    defer – задерживает выполнение скрипта до полной загрузки страницы

    language – определяет язык скрипта: JavaScript — язык программирования JavaScript; JScript — разновидность языка JavaScript разработанная компанией Microsoft; VBS, VBScript — язык программирования VBScript основанный на Visual Basic

    runat – runat=" server" показывает, что скрипт будет работать на сервере.

    src – URL файла со скриптом

    type – MIME-тип, определяющий язык скрипта: text/javascript — язык программирования JavaScript; text/vbscript — язык программирования VBScript

    Пример. Подключаем скрипт Javascript < script type=" text/javascript" > <! -- Now = new Date(); document.write(" Страница загружена в" + Now.getHours() + ": " + Now.getMinutes() + ": " + Now.getSeconds()); //--> < /script> При такой записи на странице будет выводится время загрузки страницы, которое определяется кодом на Javascript.

    < BASE> указывает полный базовый адрес документа. Применяется для составления относительных адресов и для указания целевого окна всех ссылок страницы. Тег < base> рекомендуется использовать для уменьшения объема страниц, за счет того, что не нужно писать полные адреса в ссылках, изображениях, скриптах и объектах. Так же лучше страховать правильность адресов этим тегов на проектах с большой вложенностью папок. Размещается внутри тега < HEAD>. У этого тега несколько атрибутов:

    href – задает базовый адрес документа

    target – имя окна или фрейма, куда будут открываться документы по ссылкам с текущей страницы. Зарезервированные имена: _blank — откроет документ в новом окне; _parent — откроет документ во фрейме-родителе. Если такого нет, откроет в текущем окне; _top — отменяет все фреймы и загружает страницу в полном окне браузера, если фремов нет, откроет в текущем окне; _self — откроет в текущем окне (по умолчанию).

    Пример. Задаем базовый адрес для документа: < head> < base href=" https://mysite.com/" /> < /head> При такой записи адреса на сайте у ссылки будут таким: https://mysite.com/test.html
    Пример. Открывать все ссылки в новом окне < head> < base target=" _blank" /> < /head>

    < BODY> … < /BODY> определяет границы тела документа. Внутри тега располагаются все элементы, отвечающие за содержание HTML-страницы. Заключается внутри тега < HTML>.

    alink – задает цвет активной ссылки (в момент нажатия).

    background – задает URL фонового рисунка.

    bgcolor – задает цвет фона страницы

    bgproperties – при установке bgproperties=" fixed" фон фиксируется и не прокручивается вместе со страницей

    bottommargin – определяет отступ от нижнего края окна браузера.

    class – определяет имя используемого класса

    dir – задает направление: ltr — направление слева направо (по умолчанию); rtl — направление справа налево

    id – уникальный идентификатор

    lang – определяет язык отображаемого документа

    leftmargin – определяет отступ от левого края окна браузера.

    link – задает цвет ссылок.

    onblur – потеря фокуса элементом.

    onclick – щелчок на элементе

    ondblclick – двойной щелчок на элементе

    onerror – ошибка сценария на странице.

    onfocus – получение фокуса элементом.

    onkeydown – нажатие клавиши, когда элемент имеет фокус

    onkeypress – нажатие и освобождении клавиши, когда элемент имеет фокус

    onkeyup – освобождение ранее нажатой клавиши, когда элемент имеет фокус

    onload – окончание загрузки страницы

    onmousedown – нажатие кнопки мыши, когда элемент имеет фокус

    onmousemove – движение указателя мыши, когда элемент имеет фокус

    onmouseout – смещение указателя мыши с элемента

    onmouseover – помещение указателя мыши на элемент

    onmouseup – освобождение ранее нажатой кнопки мыши, когда элемент имеет фокус

    onresize – изменение пользователем размера окна.

    onunload – выгрузка браузером текущего документа из окна или фрейма

    rightmargin – определяет отступ от правого края окна браузера.

    scroll – управляет отображением полос прокрутки: yes — отображает полосы прокрутки (по умолчанию); no — запрещает показ полос прокрутки

    style – задает встроенную таблицу стилей

    text – задает цвет текста. Значение по умолчанию #000000.

    title – добавляет всплывающую подсказку

    topmargin – определяет отступ от верхнего края окна браузера.

    vlink – задает цвет посещенных ссылок.

     

    Пример. Задаем фон картинкой fon.jpg, задаем цвет фона #302020, задаем цвет текста #EEE, задаем цвет ссылок на странице #44C1DC, задаем цвет уже посещенных ссылок #721CA4 < html> < head> ... < /head> < body background=" fon.jpg" bgcolor=" #302020" text=" #EEE" link=" #44C1DC" vlink=" #721CA4" > ... тело документа. ... < /body> < /html>





    © 2023 :: MyLektsii.ru :: Мои Лекции
    Все материалы представленные на сайте исключительно с целью ознакомления читателями и не преследуют коммерческих целей или нарушение авторских прав.
    Копирование текстов разрешено только с указанием индексируемой ссылки на источник.