Name- Aman Kuamr Gupta
Reg No- 23BCY10119
Date- 30-10-2025
HTML Code:
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Page Title</title>
</head>
<body>
<h2>Heading Content</h2>
<p>Paragraph Content</p>
<p><b>This is a page</b></p>
<h1><strong>This is a Page!</strong></h1>
</body>
</html>
Render Page:
Bold Text Use (<b> .. </b>)
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p>This text is normal.</p>
<p><strong>This text is bold.</strong></p>
</body>
</html>
Render Page:
Strong text
<!DOCTYPE html>
<html >
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p>This text is normal.</p>
<p><strong>This text is important!</strong></p>
</body>
</html>
< i > and < en > Element
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p>This text is normal.</p>
<p><i>This text is italic.</i></p>
<p><em>This text is italic.</em></p>
</body>
</html>
Render Page:
HTML <small> Element code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p>This is some normal text.</p>
<p><small>This is some small text.</small></p>
</body>
</html>
Render Page:
HTML <mark> Element code:
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p>Do not forgot to buy <mark>milk</mark> today.</p>
</body>
</html>
Render Page:
HTML <del> Element code:
<!DOCTYPE html>
<html lang="en">
<body>
<p>My favorite color is <del>blue</del> <ins>red</ins>.</p>
</body>
</html>
Render Page:
HTML <ins> Element code:
<!DOCTYPE html>
<html lang="en">
<body>
<p>My favorite color is <del>blue</del> <ins>red</ins>.</p>
</body>
</html>
Render Page:
HTML <sup> Element code:
<!DOCTYPE html>
<html lang="en">
<body>
<p>This is <sup>superscripted</sup> text.</p>
</body>
</html>
Render Page:
HTML <sub> Element code:
<!DOCTYPE html>
<html lang="en">
<body>
<p>This is <sub>subscripted</sub> text.</p>
</body>
</html>
Render Page:
Background Color Code:-
<!DOCTYPE html>
<html lang="en">
<body>
<h1 style="background-color: dodgerblue;">Hello World</h1>
<p style="background-color: tomato;">
Lorem ipsum dolor sit amet, consectetuer adipiscing elit, sed diam
nonummy nibh euismod tincidunt ut laoreet dolore mage aliquam erat
volutpat, Ut wisi enim ad minim veniam, quis nostrud exerci tation
ullamcorper suscipit lobortis nisl ut aliqrip ex ea commodo consequat.
</p>
</body>
</html>
Render Page:
Border Color code:-
<!DOCTYPE html>
<html lang="en">
<!-- <head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head> -->
<body>
<h1 style="border: 2px solid tomato;">Hello World</h1>
<h1 style="border: 2px solid dodgerblue;">Hello World</h1>
<h1 style="border: 2px solid violet;">Hello World</h1>
</body>
</html>
Render Page:
Color Values code:-
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, initial-scale=1.0">
<title>Document</title>
</head>
<body>
<p>Same as color name "Tomato":</p>
<h1 style="background-color: rgb(255,99,71);">rgb(255,99,71)</h1>
<h1 style="background-color: #ff6347;">#ff6347</h1>
<h1 style="background-color: hsla(9,100%,64%);">hsla(9,100%,64%)</h1>
<p>Same as color name "Tomato", but 50% transparent:</p>
<h1 style="background-color: rgba(255,99,71, 0.5);">rgba(255,99,71,
0.5)</h1>
<h1
style="background-color:rgba(9,100%,64%,0.5);">rgba(9,100%,64%,0.5)</h1>
<p>In addition to the predefined color names, colors can be specified
using RGB, HEX, HSL, or even transparent colors using RGBA or HSLA color
values.</p>
</body>
</html>
Render Page:
