Scribd
Upload
40 views18 pages

HTML Basics: Lists, Tables, Forms

The document provides an overview of HTML elements including lists, tables, forms, and various input types. It explains the structure and usage of unordered and ordered lists, table rows and headers, form actions, and input elements like text fields, checkboxes, and select dropdowns. Additionally, it covers multimedia elements like iframes and videos, along with their attributes.

Uploaded by

ntpawar18
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
40 views18 pages

HTML Basics: Lists, Tables, Forms

The document provides an overview of HTML elements including lists, tables, forms, and various input types. It explains the structure and usage of unordered and ordered lists, table rows and headers, form actions, and input elements like text fields, checkboxes, and select dropdowns. Additionally, it covers multimedia elements like iframes and videos, along with their attributes.

Uploaded by

ntpawar18
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd

Level Pro

List in HTML
Lists are used to represent real life list data.

unordered ordered
<ul> <ol>
<li> Apple </li> <li> Apple </li>

<li> Mango </li> <li> Mango </li>

</ul> </ol>
Tables in HTML
Tables are used to represent real life table data.
<tr> used to display table row

<td> used to display table data

<th> used to display table header


Tables in HTML Name Roll No
Mayank 1664
<table>
<tr>
<th> Name </th>
<th> Roll No </th>
</tr>
<tr>
<td> Shradha </th>
<th> 1664 </th>
</tr>
</table>
Caption in Tables

<caption> Student Data </caption>

Student Data
Name Roll No
Mayank 1664
thead & tbody in Tables

<thead> to wrap table head

<tbody> to wrap table body


colspan attribute
colspan="n"
used to create cells which spans over multiple columns

Data
Mayank 1664
Mehul 1890
Form in HTML
Forms are used to collect data from the user
Eg- sign up/login/help requests/contact me

<form>

form content

</form>
Action in Form
Action attribute is used to define what action needs to be
performed when a form is submitted

<form action="/[Link]" >


Form Element : Input
<input type="text" placeholder="Enter Name">
Label
<label for="id1">

<input type="radio" value="class X" name="class" id="id1">

</label>

<label for="id2">

<input type="radio" value="class X" name="class" id="id2">

</label>
Class & Id
<div id="id1" class="group1">

</div>

<div id="id2"> class="group1">

</div>
Checkbox
<label for="id1">

<input type="checkbox" value="class X" name="class" id="id1">

</label>

<label for="id2">

<input type="checkbox" value="class X" name="class" id="id2">

</label>
Textarea
<textarea name="feedback" id="feedback" placeholder="Please add Feedback">

</textarea>
Select
<select name="city" id="city">

<option value="Delhi"> Delhi </option>

<option value="Mumbai"> Delhi </option>

<option value="Banglore"> Delhi </option>

</select>
iframe Tag
website inside website

<iframe src="link"> Link </option>


Video Tag
<video src="myVid.mp4"> My Video </video>

Attributes
- controls
- height
- width
- loop
- autoplay
All the very best in your future
journey :)

-Mayank Pawar

You might also like