Тег для создания таблицы.
|
|
Определяет тело таблицы.
|
|
|
Создает ячейку таблицы.
|
|
Используется для объявления фрагментов HTML-кода, которые могут быть клонированы и вставлены в документ скриптом. Содержимое тега не является его дочерним элементом.
|
|
Создает большие поля для ввода текста.
|
|
Определяет нижний колонтитул таблицы.
|
|
Создает заголовок ячейки таблицы.
|
|
Определяет заголовок таблицы.
|
|
Определяет дату/время.
|
|
Заголовок HTML-документа, отображаемый в верхней части строки заголовка браузера. Также может отображаться в результатах поиска, поэтому это следует принимать во внимание предоставление названия.
|
|
Создает строку таблицы.
|
|
Добавляет субтитры для элементов и .
|
|
Выделяет отрывок текста подчёркиванием, без дополнительного акцента.
|
|
Создает маркированный список.
|
|
Выделяет переменные из программ, отображая их курсивом.
|
|
Добавляет на страницу видео-файлы. Поддерживает 3 видео формата: MP4, WebM, Ogg.
|
|
Указывает браузеру возможное место разрыва длинной строки.
|
Таблица-шпаргалка с тегами
Для удобства пользования я сгруппировала теги по тематическим разделам, добавив значения свойства display для каждого тега. Чтобы перейти к таблице, кликните по рисунку.
указывает, в соответствии с каким стандартом HTML написана ваша Web-страница.
DOCTYPE
Описание
HTML5
|
|
Для всех документов.
|
HTML 4.01
|
|
Строгий синтаксис HTML.
|
|
Переходный синтаксис HTML.
|
|
В HTML-документе применяются фреймы.
|
XHTML 1.0
|
|
Строгий синтаксис XHTML.
|
|
Переходный синтаксис XHTML.
|
|
Документ написан на XHTML и содержит фреймы.
|
|
XHTML мобильного профиля, добавляет специфические элементы для мобильных телефонов.
|
XHTML 1.1
|
|
Никакого деления на виды это определение не имеет,
синтаксис один и подчиняется четким правилам.
|
Итак, доктайпов существует несколько (строгие и переходные, для HTML и XHTML). Какой стандарт выбрать - вот в чем вопрос.
Стандарты HTML и XHTML
HTML - стандартный язык разметки Web-документов.
В HTML 4.01 и HTML5 внешний вид страницы отделен от ее содержания. Содержание и структура (заголовки, абзацы, ссылки) задаются в HTML.
Оформление (выравнивание, шрифты, цвета) задаются CSS-стилями.
Например, тег и атрибут align объявлены устаревшими.
XHTML - расширяемый язык разметки Web-документов, созданный на базе XML . Стандарт XHTML представляет собой перечень различий между HTML 4.01 и XHTML.
Требования XHTML
Нельзя
Нужно
Все теги должны быть закрыты.
|
|
|
Все теги, атрибуты и CSS-свойства должны быть набраны в нижнем регистре.
|
|
|
Все значения атрибутов тегов должны быть заключены в кавычки.
|
|
|
Должна строго выполняться иерархия: первый тег закрывается последним.
| ...
| ...
|
Блочный тег не может быть вложен в строчный. (После блочного элемента дальнейший вывод на странице осуществляется с новой строки. Строчный элемент перевода строки не делает.)
| ...
| ...
|
Булевы атрибуты записываются в развёрнутой форме.
|
|
|
У изображений обязательно должно быть указано описание
|
|
|
Достоинства языка XHTML - не строгость синтаксиса, а возможность придумывать собственные теги.
Однако, 2 июля 2009 года Консорциум Всемирной паутины (W3C) сообщил о прекращении работ над XHTML 2.0, посчитав концепцию XHTML неверной.
Группа программистов переключилась на работу над стандартом HTML5. И хотя стандарт HTML5 всё ещё не утверждён, на нём уже написано множество сайтов.
Кому интересно, когда же HTML5 будет закончен, могут ознакомиться с первоисточниками:
Официальная версия стандарта HTML5 находится по адресу: www.w3.org/TR/html5/
Определимся с выбором. Сделать его несложно: использовать XHTML-стандарт не стоит, если вы не собираетесь расширять язык HTML.
На!DOCTYPE, предназначенных для документов, использующих фреймы , останавливаться не будем: позавчерашний день.
Следующий вопрос: какой выбрать синтаксис - строгий или переходный?
Строгий и переходный синтаксис HTML 4.01
Переходные синтаксисы существуют для того, чтобы облегчить переход на новый стандарт. Они пропустят многое из того, что строгий синтаксис посчитает ошибками.
Понять, что тут к чему, проще на примере. Сначала зададим строгий синтаксис.
Строгий синтаксис
Проверка на валидность
Проверка на валидность
красным цветом.
Соответствие HTML-кода объявленному стандарту называют валидностью
, а проверку на это соответствие - валидацией
.
Чтобы отслеживать ошибки верстки, установим дополнение к FireFox Html Validator .
Откроем нашу страницу в браузере FireFox, наведем мышку на знак валидатора:
Двойной щелчок на знаке валидатора даст развернутый список ошибок:
Поменяем!DOCTYPE на переходный синтаксис:
Переходный синтаксис
Проверка на валидность
Проверка на валидность
Часть текста понадобилось выделить красным цветом.
Запускаем FireFox. Ошибок нет:
Вроде все прекрасно. Может, на этом и остановиться?
Мой совет: делать валидную верстку или в соответствии со строгим синтаксисом HTML 4.01, или сразу на HTML5.
HTML надо использовать по его прямому назначению, а оформление оставить CSS.
Кроме того, если у сайта валидная верстка, а он неправильно отображается в каком-либо браузере, то это однозначно проблема браузера.
Новые версии браузера будут лучше соответствовать стандарту и не ошибаться в интерпретации валидного кода.
Если же сложная верстка реализована невалидным способом, то нет гарантий, что новые версии браузеров не рассыпят ее на кусочки.
Не соблазняйтесь лояльностью переходного синтаксиса, только строгое соответствие стандартам!
Зачем нужна валидная верстка
Казалось бы, зачем мучиться? Ведь маленькие недочеты верстки браузеры часто исправляют автоматически, и сайт работает абсолютно нормально.
Но эти мелкие, практические незаметные ошибки тем не менее замечают поисковые системы.
Даже один отсутствующий тег - это минус на оценке качества сайта.
Именно из-за способности поисковых систем замечать любые недочеты HТML-кода и рекомендуется соблюдать валидность верстки.
Кроме того, проверяя код на валидность, можно обнаружить наряду с мелкими недочетами еще и серьезные ошибки, которые были не замечаны ранее.
Александр Кичатов
Как работают PHP скриптыНаверняка ты знаком с принципом работы радиоуправляемых машинок. Нажимаешь вперёд - машинка едет, нажимаешь влево - машинка меняет направление колёс. PHP работает точно также. Ты пишешь команды одну за другой, а PHP последовательно их исполняет. Что такое PHP скриптPHP-скрипт - это обычный текстовый файлик с расширением .php
. Точно такой же, как html и css. Но есть одно важное отличие: Скрипты запускаются только через http-запросы в браузере. Это значит, что для запуска скрипта script.php необходимо в адресной строке браузера написать site.ru/script.php
Если скрипт не работает - проверь текущий URL. Если там будет что-то вроде file:///D:/openserver/domains/site.ru/script.php
- это значит, что ты пытаешься не перейти на страницу сайта, а открыть сам PHP файлик в браузере. Это неправильно. Веб-серверы чаще всего настроены так, что при заходе на главную страницу (например site.ru
) автоматически запускается файл index.php или index.html, лежащий в корне сайта. Создай в корневой папке сайта файл с названием index.php и открой его в своём текстовом редакторе. При наличии файла index.html его нужно удалить. Если у тебя пока нет текстового редактора - рекомендую лёгкий и бесплатный Notepad++ , он гораздо удобней встроенного в Windows блокнота. Обязательно следи за кодировкой скриптов. Кодировка должна быть либо UTF-8 без BOM
(если такая доступна в твоём редакторе), либо просто UTF-8
. Вывод чисел и строк в PHPКоманды PHP пишутся между тегами
, например:
Команда echo
отвечает за вывод информации на экран. После оператора указывается значение, которое нужно вывести. Чтобы вывести текст, его нужно указать в одинарных или двойных кавычках:
Команды в PHP разделяются точкой с запятой. Для удобства чтения каждую команду принято писать с новой строки:
Результат в браузере: Это PHP код.
Вывод HTML кода в PHPHTML-код можно перемешивать с командами PHP:
Также HTML код можно подставить в PHPшную строку:
Результат в браузере: Слон
Наполеон
Мы можем как угодно совмещать PHP код и HTML теги:
Функции в PHPФункция - это команда, которая выполняет какие-либо действия, например расчёты, управление файлами и т.д. Определить функцию просто - у неё после названия идут круглые скобки:
Функция phpinfo()
выводит на экран информацию с текущими настройками PHP. Некоторые функции ожидают, что им передадут какое-нибудь значение. Например, функция округления ceil()
ожидает число, которое она округлит:
Функция ceil()
получает переданное нами значение 91.5
, обрабатывает его (округляет до 92) и возвращает результат. А команда echo получает возвращённое функцией значение и выводит его на экран. Результатом работы этого скрипта будет 92
. Необходимость закрывающего тега в PHPЕсли после PHP команд нет HTML или любого другого вывода на экран, то мы можем не использовать закрывающий тег ?>
:
Кроме этого, мы можем заменить тег
Использование тега
|