Note: Html

A web page can be split into three sectors according to the programming language used to build it
Html- structure, CSS- style, javascript- core

Html is a language full of <tag>.

<> : Tag. Create a block which gives some attribution to content included.
# Some Tag itself has attribution can be modified by given value.
Ex <input type=”text”>

<h1></h1>: Header. Exist different version from h1~h6, larger to small.
<div></div>: Same function as header, but not semantic.

<a herf=”url”></a>: Hyperlink.

<p></p>: Paragraph.

<img src=””>: Image. Give the path of the source to src.

<audio controls></audio>
<video controls></video>
# Sources are written inside the block, should give the path and the type of data.

<ol></ol>: Ordered list.
<ul></ul>: Unorder list.
<li></li> : List. Usually be included in the above two label.

<!-->: Comment. Not show in html.

<br> : Create new line.

<b></b> : Bold. <strong></strong> give the same result as well.
<i></i>: Italic. <em></em> give the same result as well.
<span></span>: Same function as strong, but not semantic.
# The precision of the label will effect the quality to be searched, so if you are just looking for some visual affect, please use CSS instead.

#Semantic tag
#No actuall effect to the content, but help clarify the structure and make it easier to be searched by other.
<header>, <footer>, <aside>, <article>
<nav>:Navigation. Link to other pages.

Input

Input data by the user. All submitted data should be in <form> tag. The data will transmit to the path from the action in the way "method" assign.
# <form action="" method="">

<input type="", id, class, name, value>: Can create several type for user to input data.

# Id and class are labels for other front-end programs, such as CSS and Javascript. Id should be unique, but class can be replicated.
# Name is the label for back-end programs. When inputs data are submitted to the server, they are saved by their ''name".
#Value is the value you will submit for this input, it may be just number but not the text you input.

Types:
1.Text box: text, password, email, tel.
2. Choose: Choose one- radio, choose several-checkbox.
# All answers to a question should share the same “name”.
3. Submit: Create a button. Click it to submit all data.

<select>: Create a list to select. Options for selecting should be inside another <option> tag. Attribution “name” are written only in select tag.

<textarea>: Create a box for inputting text.

<label for=”id”>: Create a label to link to the input box. Use the attribution “for ” to link to a particular input by its “id”. Once you create the label, you can switch to the input box by clicking the text included by label tag.

Default setting attribution:
checked for radio and checkbox, selected for option from select.
placeholder will show an assistant text inside the input text box.

Table

Create a table. The table has its own special tag, generally add a letter “t” before the origin form.

<thead>,<tbody>,<tfoot> ( Semantic tag.

<table></table>: Declare a table. Has an attribute ''border" which can control style of table. (Default setting border=”1”) All setting about this table should be included in this tag.

<tr></tr>: Create a row in the table. This tag should include all the cell of that roll. In other words, all the data in that row.

<td></td>: Create a cell in a row of table. The smallest object in the table that contains data.

<th></th>: Create a cell that include a column name.