Warning:
This wiki has been archived and is now read-only.

Educational materials/Basic content

From HTML Wiki
Jump to: navigation, search

Basic content

The following example is a basic content. 

<body>
  <h1>ABOUT W3C</h1>
  <p>The World Wide Web Consortium (W3C) is an international community where Member organizations,
         a full-time staff, and the public work together to develop Web standards.</p>
  <hr>
  <h2>Questions About W3C or the Web?</h2>
  <p>Please consult the Help and FAQ for answers to questions such as:</p>
  <ul>
    <li>What does W3C do?</li>
    <li>How is W3C funded?</li>
    <li>Is W3C sending me spam?</li>
  </ul>
</body>


Heading

Headings are specified by <h1>, <h2>, <h3>, <h4>, <h5> and <h6>.

  • <h1> is said to have the highest rank, <h6> has the lowest rank, and two elements with the same name have equal rank.
<h1>h1 example</h1>
<h2>h2 example</h2>
<h3>h3 example</h3>
<h4>h4 example</h4>
<h5>h5 example</h5>
<h6>h6 example</h6>

See also The h1-h6 element


Paragraph

Paragraphs are specified by <p>. 

<p>This is paragraphe 1</p>
<p>This is paragraphe 2</p>

See also The p element


Line

horizontal rules are specified by <hr>.

  • The hr element can omit end element. This is because It is empty element.
<p>This is paragraph 1</p>
<hr>
<p>This is paragraph 2</p>

See also The hr element


List

unordered list

Unordered list is specified by <ul> and <li>.

  • The items of the list are the li element child nodes of the ul element.
    If you would like to make 3 list items, you should specify 3 li elements.
<ul>
  <li>List 1</li>
  <li>List 2</li>
  <li>List 3</li>
</ul>

See also The ul element.

ordered list

Ordered list is specified by <ol> and <li>.

  • The items of the list are the li element child nodes of the ol element.
  • The type attribute specifies the kind of marker to use in the list.
<ol type="lower-alpha">
  <li>sample1</li>
  <li>sample2</li>
  <li>sample3</li>
</ol>

See also The ol element.

definition list

Definition list is specified by <dl>, <dt> and <dd>. 

<dl>
  <dt>tarm1</dt>
  <dd>difinition1</dd>
  <dt>tarm2</dt>
  <dd>difinition2</dd>
</dl>

See also The dl element.


challenge

try it

1. Create Web page's content that introduce your shop

[Example] 

<!doctype html>
<html lang="en">
<head>
  <meta charset="utf-8">
  <title>About | W3C cafe</title>
  <meta name="description" content="The W3C cafe is .....">
  <meta name="keywords" content="W3C cafe, coffee, .....">
</head>
<body>
  <h1>What is W3C cafe</h1>
  <p>W3C cafe is .....</p>
  <h2>History</h2>
  <p>W3C cafe is .....</p>
  <h2>Menu</h2>
  <ul>
    <li>Food</li>
    <li>Drink</li>
  </ul>
</body>
</html>


2. Check your Web browsers.

Retrieved from "https://www.w3.org/html/wiki/index.php?title=Educational_materials/Basic_content&oldid=1653"