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);
}
