Practical – 114.1 : Create a Simple Program With CSS
Program Code :
<!DOCTYPE html>
<html>
<head>
<title>My Simple CSS Page</title>
<style>
body {
background-color: #e6f2ff;
font-family: Arial, sans-serif;
text-align: center;
padding: 50px;
}
h1 {
color: #004080;
}
p {
color: #333333;
font-size: 18px;
}
.box {
background-color: white;
border: 2px solid #004080;
border-radius: 10px;
padding: 20px;
width: 300px;
margin: auto;
box-shadow: 0 0 10px rgba(0,0,0,0.1);
}
</style>
</head>
<body>
<h1>Welcome to ITI</h1>
<div class=”box”>
<p>This is a simple web page using HTML and CSS.</p>
<p>You can learn and create beautiful designs with just a few lines of code.</p>
</div>
</body>
</html>
CSS File Coding
/* style.css */
body {
background-color: #f0f8ff;
font-family: Verdana, sans-serif;
text-align: center;
padding: 50px;
}
h1 {
color: #004080;
font-size: 36px;
}
p {
font-size: 18px;
color: #333;
}
.info-box {
background-color: white;
border: 2px solid #004080;
border-radius: 10px;
padding: 20px;
width: 400px;
margin: 30px auto;
box-shadow: 0 0 10px rgba(0, 0, 0, 0.1);
}
