HTML Learning Notes (1)

Source: Internet
Author: User

1, HTML: Hypertext Markup Language, markup: is used to describe the content of the Web page specific symbols, not programming language, but a descriptive markup language.

2. Making HTML Web files

A. Create a new Notepad file and rename it to *.html

B. Enter the information content of the Web page inside

C, add HTML tags on both sides of the content to be decorated

3. Syntax for HTML tags: there are two types of tags: single-mark, double-mark

A, < marker > No end tag---single mark

< tag name > single type, no attribute value, such as <br>

< tag name attribute = "attribute value" > Singleton with attribute value, such as

B, < start tag > < end tag >---double mark

< tag name > </tag name > No attribute value, such as <title> </title>

< Tag Name property = "attribute value" > </tag name > attribute value <body bgcolor= "Red" > </body>

Note: The effect in the source code is not the final effect of the browser.

4, tags and attributes, attributes are separated by a space, the attributes are not distinguished in order, and the attributes are not required.

5. In XHTML, specify that all HTML tags are lowercase and all tags must be closed

HTML---XHTML

<br>---<br/>

6. HTML Document Structure

All Web files, usually made up of four pairs of tags, form the skeleton of the document:

<title> identify the title of the Web page file

Title

</title>

<body> identifying the topic part of a Web page file

Body

</body>

7, meta tag is used to define the file information, the Web page file description, easy search engine to find. Setting keywords between placement

<meta name= "keywords" content= "value" > Multiple keyword content can be separated by ","

Setting Description: <meta name= "description" content= "value" >

Set <meta name= "author" content= "author name" >

Set CharSet: <meta http-equiv= "Content-type" content= "text/html;charset=gb2312>

Set page timing Jump: <meta http-equiv= "Refresh" content= "2"; url=http://blog.csdn.net/hanbo622 ">

8. Comments

<!--comment Content--

9. Body Property

<body bgcolor= "Background color" background= "background image" text= "Text color" link= "link text color" vlink= "text color accessed"

alink= "Active link text color" leftmargin= "left boundary" rightmargin= "right Border" topmargin= "Upper boundary" bottommargin= "Lower boundary" >

10, in fact, HTML elements, HTML tags, HTML tags are one thing

11, by default, there is a distance between the page content and the browser border, there are some HTML elements have default values

12, the page file name, can be used in local Chinese characters (practice. html) Future Web pages are stored on the server, usually in English.

13. <font> Mark

<font color= "Text color" size= "Font size" face= "Font" > Text </font>

Fonts and font sizes in Web pages are generally decorated with CSS

White #FFFFFF

Red #FF0000

Blue #0000FF

Black #000000

Green #00FF00

Grey Gray #999999

14. Character Format

Bold <b> Text </b>

Tilt <i> Text </i>

Enhanced Tone (bold) <strong> text </strong>

Enhanced tone (tilt) <em> text </em>

Underline <u> Text </u>

Delete lines <s> text </s>

Superscript <sup> Text </sup>

Subscript <sub> Text </sub>

15, when writing HTML code:

First write our control of the content of the tag, for example: this content is more important, can be semantically weighted <strong> keyword </strong> this part is the article page

Topics suggested use

16, Web page paragraph text content----<p></p>

17. Paragraph mark

<p align= "Alignment" ></p>

Left justified (default)

Center Center

Right Justify

18, the use of nesting between HTML tags, a layer of one layer will not appear errors, but not cross-nested

19, Web Optimization Core: To use appropriate HTML tags to describe the content of the Web page

20. Paragraph headings

<HX align= "Alignment" >

Paragraph title Description:

The text in the X-value [1~6] HX is automatically displayed in bold.

HX targets the paragraph, and any text of the object that the font targets

21, <br> line (line change does not change the paragraph)

22, remember to write code or the effect of the evolution process

23, in HTML, all tags must have attribute values, if the property name is not used.

Example:

<HR noshade>----HTML

24,

Size pixel absolute setting, expressed as a number, the larger the value of the property, the thicker the line

Percent relative set, in%, the greater the value of the property, the thicker the line

Width pixel absolute setting, length does not change as the window changes

Percent relative set, length varies with window width

Noshade= "NoShade" Solid Line

25. Define a block reference: Use text indent

<blockquote> </blockquote> Description

Cite URL-referenced address

26. Center Mark <center> Content </center> (discarded label)

27. Pre-formatted <pre></pre> the text enclosed in the pre element usually retains spaces and line breaks, and the text is rendered as a wide-width font, and a common application is to use

To represent the source code of the computer.

28. Special characters

Space

Version number &copy

Registered trademark &reg

"&quot

& &amp

< &LT

> &gt

29, in the text before the first word directly knocking the space does not work, two words between the number of spaces only display a space.

30. List Mark Use

List tags can create general unordered lists, numbered lists, and three ways to define lists, and you can nest another list in one list for easy generalization

A series of related content.

A, unordered list <ul></ul>

<ul type= "Bullet type" >

<li type= "Bullet type" > Content 1</li>

<li> content 2</li>

</ul>

<li> represents a project; Type:disc real Circle, circle empty circle, Square solid Square

B, ordered list <ol></ol>

<ol start= "list start" type= "Bullet type" >

<li type= "Bullet type" > Content 1</li>

<li> content 2</li>

</ol>

C, definition list <dl></dl>

<dl>

<dt> Title 1</dt> represents an item

<dd> content 1</dd> represents an explanation of more detailed content under a project

<dd> content 2</dd>

<dt> title 1</dt>

<dd> content 1</dd>

<dd> content 2</dd>

</dl>

HTML Learning Notes (1)

Contact Us

The content source of this page is from Internet, which doesn't represent Alibaba Cloud's opinion; products and services mentioned on that page don't have any relationship with Alibaba Cloud. If the content of the page makes you feel confusing, please write us an email, we will handle the problem within 5 days after receiving your email.

If you find any instances of plagiarism from the community, please send an email to: info-contact@alibabacloud.com and provide relevant evidence. A staff member will contact you within 5 working days.

A Free Trial That Lets You Build Big!

Start building with 50+ products and up to 12 months usage for Elastic Compute Service

  • Sales Support

    1 on 1 presale consultation

  • After-Sales Support

    24/7 Technical Support 6 Free Tickets per Quarter Faster Response

  • Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.