HTML Common Tags Demo

Source: Internet
Author: User
Tags number sign

HTML Common Tags Demo

All the labels shown on this page are browser default effects.

Infrastructure

<div> Define sections in a document (block elements, no attributes)

<span> Define a section in a document (inline element, without any attributes)

to define headings (usually shown in bold). Note: It is best to use only 1 H1 tags in a single page)

H1 Title H2 title H3 title H4 title H5 title H6 title

<p> Defining paragraphs

Define horizontal lines (split lines on this page are

define the section or page header

<footer> Defining the end of a section or page

<article> Definition Articles

<section> defining sections in a document

<aside> defining content related to document content

<nav> Defining navigation

Header Head Footer tail article content section content aside content NAV content

<details> Define detail content

<summary> Define the title of details

HTML 5

List

<ul> Define unordered lists (usually bulleted before the list)

    • <li> Define a list of items
    • Tom
    • John doe

<ol> defines an ordered list. (usually there is a number sign before the list)

    1. <li> Define a list of items
    2. Tom
    3. John doe

<dl> Definition definition List

<dt> Define items in the definition list
<dd> Define the description of the item in the definition list
Zhang San's genealogy
Zhang San's genealogy began in 1900 and was carried out.
Table

<table> Definition Table

<caption> Define table headings

<thead> Defining table header content in a table

<tfoot> Defining the contents of a table in a table (footnotes)

<tbody> defining the body content in a table

<tr> define rows in a table

<th> Define header cells in a table (usually shown in bold)

<td> define cells in a table

Table structure Standard order is as follows:

<table>  <caption></caption>  <thead>    <tr>      <th></th>    </tr>  </thead>  <tfoot>    <tr>      <td></td>    </tr>  </tfoot>  <tbody>    <tr>      <td></td>    </tr>  </ Tbody></table>

※ Although Tfoot is placed before tbody, the browser will still display the tfoot after tbody, and doing so will allow the browser to display the table note before getting all the data in the table.

Table title
table Header ID Table header name Table Header Date
Table Note This is the number Note This is a pseudonym. Note This is the date added
1 Tom 2009-09-09
2 John doe 2010-10-10
Self-styled border
table Header ID Table header name Table Header Date
Table Note This is the number Note This is a pseudonym. Note This is the date added
1 Tom 2009-09-09
2 John doe 2010-10-10
"Form"

<form> define the form

<fieldset> defines the bounding rectangle around the elements in the form (usually four-week indents and displays the surrounding borders)

<legend> Defining the title of the FieldSet element

title

Content

<select> Define a selection list (drop-down list, multi-select list)

<optgroup> Define a combination of related options in the selection list

<option> Define options in the selection list

TomZhang San's son.Zhang San's granddaughter. John doeJohn Doe's daughter.John Doe's grandson

Scrolling list Form

TomZhang San's son.Zhang San's granddaughter. John doeJohn Doe's daughter.John Doe's grandson

Multi-select list

TomZhang San's son.Zhang San's granddaughter. John doeJohn Doe's daughter.John Doe's grandson

Format

<blockquote> Define long references (usually indented in four weeks)

A
Web Standard is not a standard, but a collection of standards. The Web page consists mainly of three parts: structure (Structure), Performance (Presentation) and Behavior (Behavior). The corresponding standards are divided into three aspects: the structure standard language mainly includes XHTML and XML, the performance standard language mainly includes the CSS, the behavior standard mainly includes the object model (such as the ECMAScript DOM), and so on. Most of these standards are drafted and published by the consortium, and some are standards set by other standards organizations, such as the ECMAScript standard of the ECMA (European Computer Manufacturers Association).

<pre> defines pre-formatted text (usually preserves spaces and line breaks , and is displayed in a wide-width font, which is ideal for representing computer code)

for (var i=0; i<9; i++) {    i++;};

<address> Define contact information for the author or owner of the document (usually in italics)

Contact Small Fork
Front-end Development engineer

<a> Define links, anchor points

<em> define accent text (usually in italic display)

<strong> Define more stressed text (usually shown in bold)

<mark> Define tagged text (usually highlighted)

<time> define time (usually without any visual effects)

<del> define deleted text (usually with strikethrough)

<ins> Define new inserted text (usually underlined)

January 1, 2015 is Friday Thursday

<i> defining Italic text

<b> define bold text

<big> define large text (usually displayed with a larger font size than the body)

<small> Define small text (usually displayed with a smaller font size than the body)

<sup> defining superscript text, X2

<sub> define subscript text, H2O

<code> Definitions 计算机代码文本。This HTML Code. (typically displayed in a wide-width font, but with no spaces and line breaks, and spaces and line breaks are preserved, use <pre>) to describe

<cite> define references. You can use this tag to define references in a reference, such as the title of a book or magazine. (usually in italic display) detailed description

<q> Define short references (usually with double quotes on both sides)

<bdo> Define the direction of text

The following text is displayed from right to left: you have the ability to read backwards .

<abbr> Defining abbreviations

Microsoft launched the browser is IE browser. (Mouse over "IE" to see the effect)

<progress> define a progress bar

<meter> Definition degree measurement

Image

Defining images

<map> Define clickable areas

<area> Define the inner area of the clickable area

The links on the left and right side of the picture are different:

<figure> Define media content in a document (Pictures, charts, photos, code, etc.)

<figcaption> Define a caption for a figure element

Small Fork Test Field

<canvas> define Canvas (no demo here)

"Audio/Video"

<audio> Define Sounds

<source> define a media source

<audio> definition Video

<video> Define Subtitles

Other

<noscript> Define alternative content for users who do not support client-side scripting

JavaScript scripts are currently supported by your browser

<noframes> Define alternative content for users who do not support frames

<ruby> define ruby annotations

<rt> Define the interpretation of Ruby annotations

<rp> Definition If the browser does not support the content displayed by Ruby elements

HTML Common Tags Demo

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.