Scribd
Upload
10 views5 pages

Experiment 1

The document contains four programs demonstrating the use of Internal CSS in HTML. Program 1 changes the background color of a webpage, Program 2 styles a heading, paragraph, and list, Program 3 applies different font styles and sizes, and Program 4 is intended to demonstrate padding and margin. Each program includes HTML code with specific CSS styles applied to various elements.

Uploaded by

paneer027
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
10 views5 pages

Experiment 1

The document contains four programs demonstrating the use of Internal CSS in HTML. Program 1 changes the background color of a webpage, Program 2 styles a heading, paragraph, and list, Program 3 applies different font styles and sizes, and Program 4 is intended to demonstrate padding and margin. Each program includes HTML code with specific CSS styles applied to various elements.

Uploaded by

paneer027
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
You are on page 1/ 5

EXPERIMENT 1:INTERNAL CSS

1. Program 1: Write a program to change the background color of a webpage using Internal
CSS.

<!DOCTYPE html>

<html lang="en">

<head>

<title>Change Background Color</title>

<style>

/* Internal CSS to change the background color */

body {

background-color: lightblue; /* You can change this color to any desired color */

</style>

</head>

<body>

<h1>Welcome to the Webpage!</h1>

<p>This page has a light blue background color.</p>

</body>

</html>

2. Program 2: Write a program to style a heading, paragraph, and list using Internal CSS.

<!DOCTYPE html>
<html lang="en">

<head>

<title>Style Heading, Paragraph, and List</title>

<style>

h1 {

color: darkblue;

font-family:bold;

text-align: left-corner;

font-size: 36px;

margin-top: 20px;

p{

font-size: 18px;

line-height: 1.6;

color:brown;

text-align:left-corner

margin: 20px;

ul {

list-style-type: square;

padding-left: 40px;

ul li {

font-size: 18px;

color:green;
margin-bottom: 10px;

body {

font-family: bold;

background-color: white;

margin: 0;

padding: 0;

</style>

</head>

<body>

<h1>This ia a Heading</h1>

<p> this is a paragraph styled using Internal CSS.</p>

<ul>

<li>Item 1</li>

<li>Item 2</li>

<li>Item 3</li>

</ul>

</body>

</html>
1. Program 3: Write a program using Internal CSS to apply different font styles, colors, and
sizes to multiple HTML elements.

<!DOCTYPE html>

<html lang="en">

<head>

<title>CSS Font Styles Example</title>

<style>

/* Styling the body */

body {

font-family: Arial, sans-serif;

background-color:white;

margin: 0;

padding: 20px;

/* Styling the heading */

h1 {

font-family: 'Georgia', serif;

color:blue;

font-size: 45px;

text-align: left-corner;
}

p{

font-family:italic;

color: purple;

font-size: 28px;

font-weight:italic;

</style>

</head>

<body>

<h1>Main Heading</h1>

<p> This ia an italic paragraph</p>

</body>

</html>

Program 4: Write a program to demonstrate the use of padding and margin using Internal CSS.

You might also like