Forth day of fullstack development -> HTML table/Form.

HTML Table

1.<table></table> -> the table element to create table.

2.<tr> </tr> ->  tr is a table row, where table define in rows and coloumn.

3.<th></th> ->Th is the table heading tag which defines the heading of the table.

4.<td></td> -> td is the data tag, use to give data in table.

5.<thead></thead> ->Th is the table heading tag which defines the heading of the table.

6.<tbody></tbody> ->tbody is just define that table main contain is started from here.

7.<colspan> </colspan> -> It merges the 2 column and make it one.

<tr>
    <th colspan="2">Name</th>
    <th>Age</th>
  </tr>

8.<rowspan> </rowspan> -> it merges the 2 row and make it one.

<tr>
    <th rowspan="2">Phone</th>
    <td>555-1234</td>
  </tr>

HTML FORM

<form action="" method="post"> </form> -> the way form tag structure

action:- whenever page submits it redirects to the given path.

method:-

Input:-

two ways to write form

the first way to define element:-

 <label>

            checkbox:

            <input type="checkbox">

        </label>

second Way to define the form element:-

<label for="username">Enter username</label> 

<input type="text" placeholder="username" id="username">

Input tag:- input tag is used, to take the input from the user, it contains the imp. and sub-element.

type:- can define the way of taking input from the user.

example:-

type="text"

type="password"

type="button"

type="color"

Placeholder:- the placeholder is the element in input that fills the temporary space of input, till the user fills the data and also guide the user what to fill in the box.

id:- is a unique name to identify elements to the developer.

label:- to give a name shows that user can know the field.

for:- is an element that help to show connection b/w label and input

if for in label and id in the input are the same then both are related to each other.

Button:-

Button:-It is a simple button which default type is to submit the form.

<button></button>

type:- type define what will button do.

<button type="submit">submit</button>

<button type="reset"></button>

basics:-

    <form action="https://www.google.com/search">

        <input type="text" name="q">

        <button>search</button>

    </form>

Name:- use as unique letters, which help to pass the data to the server.

action:- It contains the address of the server where data will pass.