Scribd
Upload
13 views3 pages

HTML and CSS Essentials Guide

The document provides detailed notes on web design concepts, focusing on HTML elements such as lists, tables, images, frames, and forms. It explains the structure and usage of ordered, unordered, and definition lists, as well as the basic structure of tables and forms. Additionally, it covers CSS types for styling HTML elements, including inline, internal, and external CSS.

Uploaded by

sy0306402
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
13 views3 pages

HTML and CSS Essentials Guide

The document provides detailed notes on web design concepts, focusing on HTML elements such as lists, tables, images, frames, and forms. It explains the structure and usage of ordered, unordered, and definition lists, as well as the basic structure of tables and forms. Additionally, it covers CSS types for styling HTML elements, including inline, internal, and external CSS.

Uploaded by

sy0306402
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

Web Design Concept - Detailed Notes

1. Lists in HTML
Lists help in organizing content in a structured way. There are three types of lists in HTML:

a. Ordered List (<ol>)


- Displays items in a sequential manner.

Example:
<ol>
<li>HTML</li>
<li>CSS</li>
<li>JavaScript</li>
</ol>

b. Unordered List (<ul>)


- Displays items with bullet points.

Example:
<ul>
<li>Apple</li>
<li>Banana</li>
<li>Mango</li>
</ul>

c. Definition List (<dl>)


- Used for definitions with terms and descriptions.

Example:
<dl>
<dt>HTML</dt>
<dd>HyperText Markup Language</dd>
</dl>

2. Tables in HTML
Tables are used to present data in a structured format using rows and columns.
Basic Table Structure:
<table border="1">
<tr>
<th>Name</th>
<th>Age</th>
</tr>
<tr>
<td>John</td>
<td>25</td>
</tr>
</table>

3. Images in HTML
Images enhance the visual appeal of a webpage.

Basic Image Tag:


<img src="[Link]" alt="Description" width="200" height="100">

4. Frames in HTML
Frames divide a webpage into multiple sections, allowing different content in each.

Using <iframe> (Modern Approach):


<iframe src="[Link] width="500" height="300"></iframe>

5. Forms in HTML
Forms are used for user input.

Basic Form Elements:


<form action="[Link]" method="post">
Name: <input type="text" name="name"><br>
Email: <input type="email" name="email"><br>
Password: <input type="password" name="password"><br>
<input type="submit" value="Submit">
</form>

6. CSS (Cascading Style Sheets)


CSS is used to style HTML elements.
Types of CSS:
1. Inline CSS: <p style="color: red;">This is red text.</p>
2. Internal CSS: <style> p { color: blue; } </style>
3. External CSS: Link with <link rel="stylesheet" href="[Link]">

You might also like