HTML notes (1) HTML-related concepts and html-related concepts
I. HTML Overview1. Basic HTML document structure
Let's take a look at an example of HTML, which contains several major HTML tags:
<! DOCTYPE html>
<html>
<head>
<meta charset = "utf-8">
<title> This is my first html </ title>
</ head>
<body>
<h1> My first title </ h1>
<p> My first paragraph! </ p>
</ body>
</ html>
Simple instructions:
Chinese web pages need to use <meta charset = "utf-8"> statement, otherwise garbled characters will appear;
DOCTYPE declares the document type and specifies the document's reference specification, which helps to display the web page correctly in the browser. The DOCTYPE declaration is not case sensitive;
<Html> </ html> defines the entire HTML document and describes the document type;
<Head> </ head> defines the head of the document and is a container for all head elements;
<Body> </ body> defines the body of the HTML document, which is the content of the visual web page;
<H1> </ h1> defines a title in the HTML document;
<P> </ p> defines a paragraph in the HTML document;
operation result:
2. What is HTML?
HTML (HyperText Markup Language): is a hypertext markup language used to describe web pages. Strictly speaking, HTML is not a programming language, but a markup language.
The so-called markup language is composed of a set of markup tags.
HTML uses markup tags to describe web pages, and HTML documents contain HTML tags and text content.
3. What is an HTML document?
HTML document: contains HTML tags and plain text, used to describe web pages.
HTML documents are also called web pages.
4. What are HTML tags?
HTML tag (HTML tag): is surrounded by angle brackets and appears in pairs of keywords.
The first tag in the tag pair is called the start tag (open tag), and the second tag is called the end tag (close tag), such as <html> </ html>.
Grammatical format: <tag> content </ tag>
Two HTML elements 1. HTML element concept
HTML documents are defined by HTML elements.
The HTML element starts with the start tag and ends with the end tag. The content of the element is the content between the start tag and the end tag.
Elements with empty content are called empty elements, that is, elements with no content, which can be closed in the start tag, such as <br />.
Most HTML elements can have attributes.
2. Nested HTML elements
HTML documents are composed of nested HTML elements.
Take the above example as an example, "<p> This is a paragraph! </ P>" is an element, the element has a start tag <p>, element content "This is a paragraph!", And an end tag </ p>. The element is nested in the element <body> </ body> element.
PS:
In XHTML, XML, and future versions of HTML, all elements must be closed. Adding a slash to the empty element is the correct way to close the element.
HTML tags are not case sensitive, but try to use lower case, because the World Wide Web Consortium (W3C) recommends using lower case in HTML4.
Three HTML attributes
Attributes are additional information provided by HTML elements, generally added in the start tag.
The attribute value should always be included in single or double quotes. If the attribute value itself contains double quotes, then the attribute value needs to be surrounded by single quotes, for example name = ‘Love“ story ”fish’
Attributes always appear in the form of "name / value pairs", such as name = "value".
Attribute example:
<img src = "google.JPG" width = "30" height = "30">
Among them, the location of the picture file is specified in the src attribute, and the size of the picture is set by the width and height attributes.
Attributes and attribute values are not case sensitive. It is recommended to use lower case attributes / attribute values.
Commonly used attributes:
Property Description
class defines one or more class names for HTML elements, which are imported from the style file
id defines the unique id of the element
style specifies the inline style of the element
title additional information describing the element (used as a toolbar)
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
