0% found this document useful (0 votes)
10 views2 pages

HTML Table and Marquee Examples

The document contains multiple HTML code examples demonstrating various web design elements, including tables with cellspacing and cellpadding, basic and styled marquees, and CSS for changing background and text colors. Each example showcases different functionalities like scrolling text, text alignment, and styling. The codes are structured to illustrate the application of HTML and CSS in web development.

Uploaded by

priyaparthi1719
Copyright
© All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as DOCX, PDF, TXT or read online on Scribd
0% found this document useful (0 votes)
10 views2 pages

HTML Table and Marquee Examples

The document contains multiple HTML code examples demonstrating various web design elements, including tables with cellspacing and cellpadding, basic and styled marquees, and CSS for changing background and text colors. Each example showcases different functionalities like scrolling text, text alignment, and styling. The codes are structured to illustrate the application of HTML and CSS in web development.

Uploaded by

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

1.

HTML Code with Cellspacing & Cellpadding OUTPUT

<!DOCTYPE html>
<html>
<head>
<title>Cellspacing vs Cellpadding</title>
</head>
<body>
<h2>Table with Cellspacing and Cellpadding</h2>
<table border="1" cellspacing="10" cellpadding="20">
<tr>
<th>Name</th>
<th>Class</th>
<th>Marks</th>
</tr>
<tr>
<td>Priya</td>
<td>12</td>
<td>95</td>
</tr>
<tr>
<td>Arun</td>
<td>11</td>
<td>88</td>
</tr>
</table>
</body>
</html>

2. Basic Marquee (Scrolling Text Left to Right) OUTPUT

<!DOCTYPE html>
<html>
<head>
<title>Marquee Example</title>
</head> This text will move from right to left
<body>

<h2>Basic Marquee</h2>
<marquee>Welcome to My Website!</marquee>

</body>
</html>

3. Marquee with Direction


OUTPUT
<!DOCTYPE html>
<html>
<head>
<title>Marquee Direction</title>
</head>
<body>
<h2>Marquee with Different Directions</h2>
<marquee direction="right">This text scrolls right</marquee> The three sentences are moving in three
<marquee direction="up">This text scrolls up</marquee> directions – Right, Up and Down
<marquee direction="down">This text scrolls down</marquee>
</body>
</html>
4. Marquee with Speed & Styling OUTPUT

<!DOCTYPE html>
<html>
<head>
<title>Marquee Styling</title>
</head>
<body>

<h2>Styled Marquee</h2>
<marquee behavior="alternate" direction="left" scrollamount="10" bgcolor="lightyellow" style="color:blue;
font-size:20px;">
Bouncing Text with Speed!
</marquee>

</body>
</html>

5. Change Background & Text Color OUTPUT

<!DOCTYPE html>
<html>
<head>
<style>
body {
background-color: lightblue;
color: darkblue;
font-family: Arial, sans-serif;
}
</style>
</head>
<body>
<h1>Welcome to CSS</h1>
<p>This page has a blue background with styled text.</p>
</body>
</html>

6. Center Text with CSS OUTPUT

<!DOCTYPE html>
<html>
<head>
<style>
h1 {
text-align: center;
color: green;
}
</style>
</head>
<body>
<h1>Centered Heading</h1>
</body>
</html>

You might also like