HTML5 Study notes-3. Writing and typesetting skills

Source: Internet
Author: User

1. Paragraph Style Tags:

(1) <p></p> tag: Paired mark, place <p> mark at beginning of paragraph,</p> at end of paragraph

Syntax: <p>...</p>, effect: wrapping and adding a blank line

(2) <br> Tags: single tag, effects: line Wrapping , Syntax: First line <br/> second row

Note: HTML5 not only conforms to the HTML standard, but also conforms to the XHTML standard, the XHTML syntax is more rigorous than HTML and the introduction, in XHTML syntax, a single tag that is not paired must be tagged with a "/" symbol , such as <br/>

The HTML5 specification also recommends the use of such marking methods

(3)

(4) <blockquote></blockquote> Tags: paired tags, indicating reference text, effects: Wrapping the text inside the tag and indenting it

Optional properties: Cite, setting values: URL URLs, Description: Description of the source of the reference

(5)

(6) Paragraph title:

Function: Set the size level of the paragraph headings,

2. Text Effect marker

(1) <font> mark (HTML5 deactivated): Example: <font size= "2" color= "#FF0000" face= "Italic" >

The default value of the Size property is 3,size's property setting value can be relative or absolute, relative to "+4", Minimum to "2", absolute value up to "7", Minimum to "1"

(2) <b> <u> <i> Tags: paired markers, Effects: set Text to bold, underline, italic

Note:HTML5 does not recommend using the above tag, preferably using CSS syntax instead

If you want to identify the highlighted text in a Web page in bold, HTML suggests using the <strong> tag (example:<strong>...</strong>)

(3) <sup> <sub>: Paired mark, effect: Set text to superscript, subscript

Example:so<sub>4</sub><sup>2+</sup>

3. List tags

(1) Symbol list:<ul></ul> (used with <li></li> tag)

Effect: Indent text paragraphs inward and add bullets to the front of each list item in the paragraph with a circular, hollow circle, or square to achieve striking results

Note: symbol lists are not sequentially numbered , so they are also called unordered lists

<li> Tag Properties: Value set values: 1 2 3 Integer value Description: Sets the start value of the numbered list, which defaults to 1, and is only useful when paired with numbered lists

Cases:

<H2>List</H2><ul>    <Li1>List Item 1</Li1>    <Li2>List Item 2</Li2>    <Li3>List Item 3</Li3></ul>

(2) Numbered list:<ol></ol> (for use with <li></li> marks)

Effect: Indent text paragraphs inward and precede each item in the paragraph with 1, 2, 3 ... sequential numbers, also known as ordered lists

<ol> Tag Properties: Type setting Value: 1, A, a, I, I description: Set number style, default is 1, ask Arabic numerals, uppercase English letters, lowercase English letters, uppercase Roman numerals, lowercase roman numerals

Start setting Value: 1, 2 integer value Description: Set the starting value of the number, the default is 1

Reversed setting Value: Reversed Description: Reverse sort, number changed from large to small (IE9 not supported)

Cases:

<H2>Numbered list</H2><ul>    <Li>Big Class 1</Li>    <oltype= "A">        <Li>1-1</Li>        <Li>1-2</Li>        <Li>1-3</Li>    </ol>    <Li>Big Class 2</Li>    <oltype= "1">        <Li>2-1</Li>        <Li>2-2</Li>        <Li>2-3</Li>    </ol>    <Li>Big Class 3</Li>    <olReversed= "Reversed">        <Li>3-1</Li>        <Li>3-2</Li>        <Li>3-3</Li>    </ol></ul>

(3) Definition list:<dl></dl> <dt> <dd>

For two paragraphs with themes and content, usually the first paragraph defines the theme with the <dt> tag, and the second paragraph defines the content with the <dd> tag

Cases:

< DL >    < DT >     title     <dd>     text </DL  >

4. Notes:

Format: <!--comment text--

Note: By using HTML annotations, you can allow IE to make conditional judgments based on the content of comments, while other browsers only treat IE annotations as normal HTML annotations

Comments on IE conditions are suggested to be placed within

You can also add some commands to restrict the version of IE, such as LT represents the older version, for example: <!--[if LT IE 9]>ie9 the following version will execute this statement <! [endif]-->

Since only IE9 and above can support HEML9, the following code is generally included for the low-version browser:

<!-- [If Lt IE 9]><script src= "Http://html5shiv.googlecode.com/svn/trunk/html5.js" ></script><! [EndIf]  -

5. Special symbols

Special symbols HTML notation
© &copy;
< &it;
> &gt;
" &quot;
& &amp;
Half-width space &nbsp;

Note: No matter how many times the keyboard space is pressed in the HTML file, Web browsing will only show a space distance

If you want to display more than one space, you must use the &nbsp; Symbol (recommended), or use full-width spaces

HTML5 Study notes-3. Writing and typesetting skills

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.