| 3.3 Cascading Style Sheets (CSS) | CSS is used to manage and present the webpage. It helps in styling HTML elements. There are various stylesheet languages, but CSS is the most common. | N/A |
| 3.3.1 Types of CSS | CSS can be used in three ways: Inline, Embedded (Internal), and External. | N/A |
| Inline CSS | CSS applied directly to an HTML element using the `style` attribute. | <h1 style="color:red; font-style:italic; text-align:center;">My Teaching Academy</h1> |
| Embedded (Internal) CSS | CSS defined within a `style` tag in the `head` section of the HTML document. | <style>
h1 {
color:red;
font-style:italic;
text-align:center;
}
</style> |
| External CSS | CSS defined in an external `.css` file linked to the HTML document. | <link rel="stylesheet" href="styles.css" /> |
| 3.3.1.1 Decorating Tables with CSS | CSS can add borders and background colors to tables. | <style>
table, th, td {
border: 1px solid black;
}
</style> |
| 3.3.1.2 Homepage Decor | CSS styles for page background, headings, and text alignment. | <body style="background-color:#E6E6FA;">
<h1 style="text-align:center;color:green">My Teaching Academy</h1>
</body> |
| 3.3.2 Scrolling Messages | Creates scrolling text on the webpage. | <div id="scroll-container">
<marquee direction="left" scrollamount="12" loop>
<div id="scroll-text">Welcome message which continuously scrolls in blue</div>
</marquee>
</div> |
| 3.3.3 Adding a Video Clip to Website | Embeds video clips in the webpage. | <video width="320" height="240" controls>
<source src="video.mp4" type="video/mp4" />
Your browser doesn't support HTML5 video.
</video> |
| 3.3.4 Using Autoplay for Videos | Automatically plays video content. | <video width="320" height="240" autoplay muted>
<source src="video.mp4" type="video/mp4" />
Your browser does not support the video tag.
</video> |