0. Edit at the top and put it at the back after finishing
1. What is the role of doctype?
DOCTYPE ( document type) is a shorthand for document type declaration in a markup language, which tells the browser what version of HTML is currently written.
The difference between DOCTYPE in HTML 4.01 and HTML5
- The doctype in HTML 4.01 needs to
文档类型定义Document Type Definitionquote DTD ( ) because HTML 4.01 is based on SGML (标准通用标记语言 国际上定义电子文档和内容描述的标准). - HTML 5 is not based on SGML, so there is no need to quote DTDs, but doctype is required to standardize browser behavior (html 5 simplifies this statement, which is intended to tell browsers to use a unified standard).
Two versions of the declaration method
HTML 5：
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>
HTML 4
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN"
"http://www.w3.org/TR/html4/loose.dtd">
2. What is the difference between HTML, XHTML, and XML
- HTML : HyperText Markup Language / Hypertext Markup Language
- XML : Extensible Markup Language / Extensible Markup Language
- XHTML : Extensible Hypertext Markup Language / Extensible Hypertext Markup Language
XML is designed to transmit and store data.
HTML is designed to display data.
HTML
HTML is a markup language used to describe and define the content of web pages, and is the most basic thing that constitutes a web page.
The so-called hypertext means that in addition to marking text, it can also mark other content, such as pictures, links, audio, and video.
XML
XML can "invent" tags on its own-this is also a meaning of "extensible".
XML is nothing special. It is just plain text. Any software capable of processing plain text can handle XML.
XHTML
The combination of HTML and XML produces XHTML. It is a more rigorous and pure HTML version.
In terms of inheritance, HTML is an application based on Standard General Markup Language (SGML) and a very flexible markup language, while XHTML is based on Extensible Markup Language (XML), which is a subset of SGML .
3. What is data-attribute?
In HTML5, we can use data-*( 自定义数据属性) as the prefix to set the custom attributes we need to access some data.
how to use?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<div id="div1" class="div1" data-id="myId" data-id-and-class="Hello">test2</div>
<div id="div2" myName="Hello">test</div>
<script>
var div1 = document.getElementById("div1");
//获取自定义的值
var myId = div1.getAttribute("data-id");
var my = div1.getAttribute("data-id-and-class");
console.log(myId); // myId
console.log(my); // Hello
//设置自定义的值
div1.setAttribute("data-name", "nicai")
var div = document.getElementById("div2");
var myName = div.getAttribute("myName");
console.log(myName); //Hello
</script>
</body>
</html>
getAttributeThe method works in all modern browsers, but it is not the purpose of HTML5 custom data-* attributes being used. This method also uses the custom attributes we used before.
4. Understanding of HTML semantics?
5. What is HTML5? What is the difference between HTML5 and HTML?
What is HTML5
HTML5Yes HTML, the main goal of the new standard is to transmit all content without any additional plug-ins such as Flash, Silverlightetc. It includes animation, video, rich graphical user interface and more.
the difference
From the point of view of the document declaration type:
HTMLIt's a long piece of code, hard to remember. The following code:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "
http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
HTML5But there are only simple statements, which are easy to remember. as follows:
<!DOCTYPE html>
From the perspective of semantic structure:
HTML4.0: There are no tags that reflect the semantics of the structure. They are usually named<div id="header"></div>this way to represent the head of the website.HTML5: It has a great advantage in semantics. It provides some new tags, such<header>as:<article>,<footer>, .
From the perspective of grammar processing:
HTML cannot handle inaccurate grammar; HTML5 can handle inaccurate grammar.
6. What are the commonly used meta tags?
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
</body>
</html>
<meta>: Document-level metadata elements
meta The types of metadata defined by elements include the following:
- If the name attribute is set, the meta element provides document-level metadata, which is applied to the entire page.
- If the http-equiv attribute is set, the meta element is a compilation instruction, and the information provided is the same as the similarly named HTTP header.
- If the charset attribute is set, the meta element is a character set declaration that tells the document which character encoding to use.
- If the itemprop attribute is set, the meta element provides user-defined metadata.
7. What is the difference between src and href?
What is src
src is the abbreviation of source, which represents the reference of external files, and represents the location of external resources, and loads the referenced file into the specified location of the html page.
The src attribute is an indispensable part of the page content, commonly used in elements such as js scripts, img pictures and frames. E.g:
<script src="script.js">
<script src="https://apps.bdimg.com/libs/jquery/2.1.4/jquery.min.js">
<img src="2.png" />
<img src="https://apps.bdimg.com/img/2.png" />
What is href
href is the abbreviation of Hypertext Reference, which means hypertext reference, which represents the location of network resources, and its direct relationship with the page is the relationship of links.
<link href="reset.css" rel=”stylesheet“/>
<a href="https://www.php.cn/">
the difference
- src refers to the location of external resources. The content pointed to will be embedded in the location of the current tag in the document. When src resources are requested, the pointed resources will be downloaded and applied to the document, such as js scripts, img pictures and frames. . When the browser parses the element, it will suspend the download and processing of other resources, knowing that the resource is loaded, compiled, and executed, so the general js script will be placed at the bottom instead of the head.
- href refers to the location (hyperlink) of the network resource, used to establish a connection with the current element or document. When the browser recognizes the file pointed to by others, it will download the resource in parallel without stopping the current document的处理。 Treatment.