html-element:
- HTML elements start with a start tag
- HTML element terminated with closing tag
Empty elements : line wrap <br />, is the correct way to close empty elements, as well as horizontal lines <hr /> and images <img />
html-attribute: The attribute value should always be enclosed in quotes.
html-注释： <!--this is comment-->
<p> element: Browsers will automatically add blank lines before and after paragraphs, and will ignore the typesetting of the source code (whitespace and line breaks are ignored) (<p> is a block-level element)
<pre></pre> tags: The formatting of spaces and newlines can be preserved.
<abbr title="etcetera">etc.</abbr> <br /> <acronym title="World Wide Web">WWW</acronym>
Abbr and acronym are abbreviations and acronyms, respectively, with title to display all the information. The <acronym> tag is not supported in HTML5, use the <abbr> tag instead.
Long blockquotes: <blockquote>Long blockquotes. long block quotes. Browsers insert line breaks and margins, </blockquote>
short quotes: <q>short quotes. Double quotation marks will be added</q>
Text formatting tags
The HTML5 specification states: <h1> - <h6> should be used for headings, <em> tags should be used for emphasized text, <strong> tags should be used for important text, and <mark> tags should be used for marked/ Highlighted text. According to the HTML5 specification, the <b> tag should only be used as a last resort when no other suitable tag is more appropriate.
Strikethrough: The <del>del element is strikethrough</del>
Underline: <ins>ins element is underlined</ins>
The HTML <abbr> element defines an abbreviation or acronym.
The HTML <dfn> element defines the definition of an item or abbreviation .
The HTML <address> element defines the contact information (author/owner) of the document or article. Address: <address>Written by me</address>
The HTML <cite> element defines the title of the work .
The HTML <bdo> element defines the text direction (bi-directional override).
html-style:
- External style sheets: When styles need to be used on many pages.
<link rel="stylesheet" type="text/css" href="style.css">
- Internal Style Sheet: When styles are used in a single file.
<style type="text/css">
body {backgroundcolor:green;}
</style>
- Inline Style Sheets: Styles are applied to individual elements.
<p style="font-size:12px;color:red;">啦啦啦</p>
URL: uniform resource lacator
Syntax rules: scheme://host.domain:port/path/filename
scheme: defines the type of Internet service, common http; host: defines the domain host, www
domain: domain name :post: port number on the host
path: path on the server filename: file name
URL Encoding: Only send over the Internet using the ASCII character set.
Only 16 color names are supported by the W3C HTML 4.0 standard, they are: aqua, black, blue, fuchsia, gray, green, lime, maroon, navy, olive, purple, red, silver, tea, white, yellow
<!DOCTYPE> is not an html tag, it provides the browser with a document declaration that html is written in the declarative version.
XHtml: EXtensible HyperText Markup Language Extensible HyperText Markup Language.
W3C divides XHTML 1.0 into three specifications: Strict (strict), Transitional (transition) and Frameset (frame). trasitional is the most commonly used XHTML DTD.
Shorthand attributes are not allowed in XHTML.
Mandatory elements in XHTML documents: doctype, html, head, body and title
Why use XHTML: To write readable documents.
XML is used to describe data, while HTML is used to display data .
The use of the name attribute is discouraged in XHTML, and the id should be used instead. In XHTML, the xmlns attribute within the <html> tag is required.
Important compatibility tip: You should add an extra space before the "/" symbol to make your XHTML compatible with today's browsers.
There are three XHTML document types:
- Strict (strictly typed)
- Transitional
- Frameset (frame type)
XHTML 元素 - 语法规则
- XHTML 元素必须正确嵌套
- XHTML 元素必须始终关闭
- XHTML 元素必须小写
- XHTML 文档必须有一个根元素
XHTML 属性 - 语法规则
- XHTML 属性必须使用小写
- XHTML 属性值必须用引号包围
- XHTML 属性最小化也是禁止的
-------- Html5
html5-shiv解决方案（IE9早期的浏览器会读取这段注释，并且理解它）
<head>
<!--[if It IE 9]>
<script src="http://html5shiv.googlecode.com/svn/trunk/html5.js"></script>
<![endif]-->
</head>
<article> <section> 与 <div> 之间的差异
<section> 元素被定位为相关元素的块。
<article> 元素被定义为相关元素的完整的自包含块。
<div> 元素被定义为子元素的块。
HTML 注释
短注释应该在单行中书写，并在 <!-- 之后增加一个空格，在 --> 之前增加一个空格：
<!-- This is a comment -->
Long comments, spanning multiple lines, should be written on separate lines via <!-- and -->:
<!-- This is a long comment example. This is a long comment example. This is a long comment example. This is a long comment example. This is a long comment example. This is a long comment example. -->
style sheet: writing rules
Long rules should be split into multiple lines:
body {
background-color: lightgrey;
font-family: "Arial Black", Helvetica, sans-serif;
font-size: 16em;
color: black;
}
- Open brackets and selectors are written on the same line
- There is a space before the opening bracket
- Use two-character indentation
- A space after colons, commas and titles
- Use double quotes only if the value contains spaces
- Closing brackets are written on a new line without a space before them