unit1 HTML5 basics
New features of HTML5 1. Canvas element for painting 2. Video and audio elements for media playback 3. Better support for local offline storage 4. New special content elements, such as article, footer, header, nav , Section 5. New form controls, such as calendar, date, time, email, url, search
1. The basic structure of HTML pages
1.1. What is HTML?
Hyper Text Markup Language is a markup language used to describe web pages. "Hypertext" means that the page can contain pictures, links, and even non-text elements such as music and programs.
HTML is not a programming language, and does not emphasize any logic.
HTML is composed of a set of paired tags, such as: < Tag keyword></tag keyword> <body></body> (double tag) Special: <input/> (single tag)
1.2, development tools
1.3 Basic structure
1.4. Web page basic information tag (the tag placed in the head)
title: Web page title
meta: Web page attributes
Supplement:
Encoding A character is stored in several bytes in the computer.
gbk National Standard Code A Chinese character is stored in 2 bytes
iso-8859-1 International code A Chinese character is stored in 1 byte
utf-8 International universal code A Chinese character is stored in 3 bytes
2. Text label (the label placed in the body)
( Content) Title tags: <h1>……<h1> | <h2>, <h3>,..., <h6>
Paragraph tags: <p>……</p>
Line break tags: <br/>
Horizontal line Tags: <hr/>
font style tags: <strong>bold font</strong>, <em>italic font</em>
annotations and special symbol tags
2.1, image label
<img src="a/book.jpg"
width="190px"
height="100px"
title=" I will display when the mouse is hovering"
alt="Display when the image fails to load"
/> The
alt attribute is used to The image is described in text.
title is used to set the prompt text when the mouse moves to the picture.
width represents the width of the image, the default unit is pixel (px);
height represents the height of the image, the default unit is also pixel (px);
src represents the reference address of the image, this address can be a relative URL or an absolute URL;
2.2, link label
2.2.1, links between pages
1) a link from one page to another page
<a href="网页地址" target="目标窗口的位置"> tag body hyperlinks <
/ A>
_self (default) display target window is the current page
_blank in every Display the target page in a new window
(_top ,_parent)
2.2.2, anchor link
1. Jump from position
A on page A to position B on this page 2. Jump from position A on page A to position B on page B
Creating steps:
1 Create a jump mark
<a name="marker"> Location B</a>
2 Create a jump link
<a href="#marker">Location A</a>
2.2.3, functional links
Functional link
Email
<a href="mailto:[email protected]">Contact us</a>
QQ
<a href="tencent://message/?uin=QQ号; Site="";Menu= yes">Contact us</a>
MSN