HTML5 has only one simple document type ：<!DOCTYPE html> , which means that the browser will analyze it according to the standard mode.
You can now use Charset in the Meta tag: <meta charset=utf-8″ />
<link rel = styleSheet href = path/to/styleSheet.css/> <script src = path/to/script.js> </script>More semantic new label
For example:: <Article>, <section>, <ASIDE>, <Hgroup>, <Header>, <FOOTER>, <Nav>, <Time>, <Mark>, <FIGCAPTION>, etc.
Video and audio<video width = 640 height = 320 preload = Auto Poster = 0.jpg Controls> <Source SRC = Movie.ogg Type = Video /OGG /> <Source SRC = Movie.mp4 Type = V Ideo /mp4 /> your browser does not support the video tag. </Video>Form enhancement
新的input类型：color, email, date, month, week, time, datetime, datetime-local, number,range,search, tel, 和url
New attributes: Required, Autofocus, Pattern, List, AutoComplete and Placeholder
New elements: <Keygen>, <DataList>, <Output>, <Meter> and <Progress>
Canvas tag draws 2D graphics.
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 (); Geographical acquisition HTML semanticization 1. What is HTML semanticization?The content semantics is judged by label, such as judging the content of the content based on the H1 label, and the <p> judgment content is paragraph, the <input> tag is the input box.
2. Why semantic?1). When removing or lost style, the page can present a clear structure
2). It is convenient for other devices to analyze (such as screen readers, blind readers, and mobile devices) to render web pages in a meaningful way
3).
4). It is convenient for team development and maintenance, and follow the W3C standard, which can reduce differentiation
3. How to determine whether your label is good?Remove the style, see if the web structure is organized well and orderly, and whether it is still well read.
4. Common semantic label modulesForm
<Form Action = METHOD => <fieldSet Style = Border: None> <LEGEND STYLE = Display: None> Login </legend> <p> <Label for = name> D = name> </p> <p> <Label for = PW> Password: </label> <input type = password ID = pw> </p> <input type = submit name = login class = subbtn> </fieldSet > </form>
The form domain should be wrapped in the FieldSet tag, and uses the legend label to explain the purpose of the form; the instructions corresponding to each INPUT tag need to use the Label tag, and set the ID property for the INPUT, set for = SOMELD in the LABLE label to make the explanation explanatory The text and the corresponding Input are associated.
5. Some issues that should be paid attention to semantic labelsUse as small as possible labels and span as little as possible;
When the semantics is not obvious, when you can use DIV or P, try to use P, because P has a pitch up and down in default, which is beneficial to compatible with special terminals;
Do not use pure style tags, such as: B, FONT, U, etc., use CSS settings.
The text that needs to be emphasized can be included in Strong or EM tags. The default style of Strong is bold (not B), EM is oblique (not I)
SummarizeThe above is the semantic label of the new characteristic of the HTML5 introduced by Xiaobian. I hope it will be helpful to everyone. If you have any questions, please leave me a message. Xiaobian will reply to everyone in time. Thank you very much for your support for the VEVB Wulin website!