Advanced HTML Topics
HTML Comments
Comments are used to leave notes or explanations within your code. They are not displayed in the browser:
<!-- This is a comment -->HTML Colors
Colors can be specified using names, HEX, RGB, or HSL values. For example:
<p style="color: blue;">This text is blue.</p>
<p style="color: #ff0000;">This text is red.</p>
<p style="color: rgb(0,255,0);">This text is green.</p>HTML CSS
CSS (Cascading Style Sheets) is used to style HTML elements. You can include CSS in three ways:
- Inline:
<tag style="property: value;"> - Internal:
<style>block within the<head> - External: Linking to a separate CSS file using
<link>
Example of internal CSS:
<style>
p { color: red; }
</style>HTML Links
Links are created using the <a> tag. The href attribute specifies the URL:
<a href="https://example.com">Visit Example.com</a>HTML Images
Images are added using the <img> tag. The src attribute specifies the image source:
<img src="image.jpg" alt="Description">HTML Favicons
Favicons are small icons displayed in the browser tab. They are added using a <link> tag in the <head>:
<link rel="icon" href="favicon.ico" type="image/x-icon">HTML Page Title
The page title is set using the <title> tag within the <head>:
<title>Page Title</title>HTML Tables
Tables are created using <table>, <tr>, <th>, and <td>:
<table>
<tr>
<th>Header 1</th>
<th>Header 2</th>
</tr>
<tr>
<td>Data 1</td>
<td>Data 2</td>
</tr>
</table>HTML Lists
HTML supports ordered and unordered lists:
<ul>
<li>Item 1</li>
<li>Item 2</li>
</ul>
<ol>
<li>Item A</li>
<li>Item B</li>
</ol>HTML Block & Inline
Block elements take up the full width available, while inline elements only take up as much width as necessary:
<div>This is a block element.</div>
<span>This is an inline element.</span>HTML Div
The <div> element is used to group and style sections of content:
<div class="container">
<p>Content inside a div</p>
</div>HTML Classes
Classes are used to apply styles to multiple elements. The class attribute is used to assign a class to an element:
<div class="myClass">Content</div>HTML Id
The id attribute assigns a unique identifier to an element, useful for styling or scripting:
<div id="uniqueId">Content</div>HTML Iframes
The <iframe> element embeds another HTML page within the current page:
<iframe src="https://example.com" width="600" height="400"></iframe>HTML JavaScript
JavaScript can be included using the <script> tag. You can include scripts internally or externally:
<script>
alert('Hello, World!');
</script>
<script src="script.js"></script>HTML File Paths
File paths specify the location of files. You can use relative or absolute paths:
<img src="images/pic.jpg" alt="Image">
<a href="/docs/file.pdf">Download PDF</a>
0 Comments