В HTML5 есть только один простой тип документа ：<!DOCTYPE html> , что означает, что браузер будет анализировать его в стандартном режиме.
Теперь вы можете использовать кодировку в метатегах: <meta charset=utf-8″ />
<link rel=stylesheet href=path/to/stylesheet.css /><script src=path/to/script.js></script>Больше семантических новых тегов
Например: <article>, <section>, <aside>, <hgroup>, <header>, <footer>, <nav>, <time>, <mark>, <figure> и <figcaption> и т. д.
Видео и аудио<video width=640 height=320 preload=auto Poster=0.jpg элементы управления> <source src=movie.ogg type=video/ogg /> <source src=movie.mp4 type=video/mp4 /> Ваш браузер не поддерживает поддержка тега видео.</video>Улучшение формы
Новые типы ввода: цвет, адрес электронной почты, дата, месяц, неделя, время, дата-время, местная дата-время, число, диапазон, поиск, телефон и URL-адрес.
Новые свойства: обязательные, автофокус, шаблон, список, автозаполнение и заполнитель.
Новые элементы: <keygen>, <datalist>, <output>, <meter> и <progress>.
Тег холста рисует 2D-графику.
var Canvas = document.getElementById('canvas');var context = Canvas.getContext('2d');context.beginPath();context.moveTo(100,100);context.lineTo(300,300);context.lineTo(100,500) ;context.lineWidth = 5;context.strokeStyle = red;context.stroke(); Получение географического местоположения HTML-семантика 1. Что такое семантика HTML?Определите семантику контента с помощью тегов, например, определите, что контент является заголовком на основе тега h1, определите, что контент является абзацем на основе тега <p>, определите, что тег <input> является полем ввода и т. д.
2. Почему семантика?1). Когда стиль удален или утерян, страница может иметь четкую структуру.
2). Удобен для анализа другими устройствами (такими как программы чтения с экрана, слепые программы чтения, мобильные устройства) для осмысленного отображения веб-страниц.
3). Способствует SEO.
4). Это удобно для командной разработки и обслуживания и соответствует стандартам W3C, чтобы уменьшить дифференциацию.
3. Как определить, семантически ли ваши теги верны?Удалите стили и посмотрите, хорошо ли организована и читабельна ли структура веб-страницы.
4. Общие модули семантических теговформа
<form action= метод=> <fieldset style=border: none> <legend style=display: none>Форма входа</legend> <p><label for=name>Учетная запись:</label><input type=text id =name></p> <p><label for=pw>Пароль:</label><input type=password id=pw></p> <input type=submit name=Login class=subBtn> </fieldset></form>
Поля формы должны быть обернуты тегами набора полей, а тег легенды должен использоваться для описания назначения формы. Текст описания, соответствующий каждому входному тегу, должен использовать тег метки, а описание должно быть создано путем установки идентификатора; атрибут для ввода и настройка for=someld в теге метки. Текст связан с соответствующим вводом.
5. Некоторые вопросы, на которые следует обратить внимание при использовании семантических теговИспользуйте как можно меньше несемантических тегов div и span;
Если семантика не очевидна, вы можете использовать div или p. Попробуйте использовать p, поскольку по умолчанию p имеет верхний и нижний интервал, что полезно для совместимости со специальными терминалами;
Не используйте теги чистого стиля, такие как: b, шрифт, u и т. д., вместо этого используйте настройки CSS.
Текст, который необходимо выделить, можно включить в тегstrong или em. По умолчанию для Strong выделен жирный шрифт (не используйте b), а для em — курсив (не используйте i).
Подвести итогВыше приведен семантический тег новой функции HTML5, представленной вам редактором. Надеюсь, это будет вам полезно. Если у вас есть какие-либо вопросы, оставьте мне сообщение, и редактор ответит вам вовремя. Я также хотел бы поблагодарить всех за поддержку сайта боевых искусств VeVb!