ECOMMERCE & WEB DESIGNING NOTES
Digital Marketing Lab Practical 2025
III SEM SKILL COURSE - ICT-2024
<!DOCTYPE html>
<html>
<style>
/*style.css*/
body {
display: flex;
align-items: center;
justify-content: center;
font-family: sans-serif;
line-height: 1.5;
min-height: 100vh;
background: #f3f3f3;
flex-direction: column;
margin: 0;
}
.main {
background-color: #fff;
border-radius: 15px;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
padding: 10px 20px;
transition: transform 0.2s;
width: 500px;
text-align: center;
}
h1 {
color: #4CAF50;
}
label {
display: block;
width: 100%;
margin-top: 10px;
margin-bottom: 5px;
text-align: left;
color: #555;
font-weight: bold;
}
input {
display: block;
width: 100%;
margin-bottom: 15px;
padding: 10px;
box-sizing: border-box;
border: 1px solid #ddd;
border-radius: 5px;
}
button {
padding: 15px;
border-radius: 10px;
margin-top: 15px;
margin-bottom: 15px;
border: none;
color: white;
cursor: pointer;
background-color: #4CAF50;
width: 100%;
font-size: 16px;
}
.wrap {
display: flex;
justify-content: center;
align-items: center;
}
</style>
<body>
<div class="main">
<h1>Smt NP Savithramma Degree College(W),Chittoor.</h1>
<h3>Enter your login credentials</h3>
<form action="">
<label for="first"> Username: </label>
<input type="text" placeholder="Enter your Username" required>
<label for="password"> Password: </label>
<input type="password" placeholder="Enter your Password" required>
<div class="wrap">
<button type="submit" onclick="solve()"> Submit </button>
</div>
</form>
<p>Not registered?
<a href="#" style="text-decoration: none;"> Create an account </a>
</p>
</div>
</body>
</html>
<!DOCTYPE html>
<html>
<head>
<title>Registration Form</title>
<style>
body {
font-family: Arial, sans-serif;
background-color: #f3f3f3;
margin: 0;
padding: 0;
display: flex;
justify-content: center;
align-items: center;
height: 100vh;
}
.main {
background-color: #fff;
border-radius: 15px;
box-shadow: 0 0 20px rgba(0, 0, 0, 0.2);
padding: 20px;
width: 300px;
}
.main h2 {
color: #4caf50;
margin-bottom: 20px;
}
label {
display: block;
margin-bottom: 5px;
color: #555;
font-weight: bold;
}
input[type="text"],
input[type="email"],
input[type="password"],
select {
width: 100%;
margin-bottom: 15px;
padding: 10px;
box-sizing: border-box;
border: 1px solid #ddd;
border-radius: 5px;
}
button[type="submit"] {
padding: 15px;
border-radius: 10px;
border: none;
background-color: #4caf50;
color: white;
cursor: pointer;
width: 100%;
font-size: 16px;
}
</style>
</head>
<body>
<div class="main">
<h2>Registration Form</h2>
<form action="">
<label for="first">First Name:</label>
<input type="text" id="first" name="first" required />
<label for="last">Last Name:</label>
<input type="text" id="last" name="last" required />
<label for="email">Email:</label>
<input type="email" id="email" name="email" required />
<label for="password">Password:</label>
<input type="password" id="password" name="password"
pattern="^(?=.*\d)(?=.*[a-zA-Z])(?=.*[^a-zA-Z0-9])\S{8,}$"
title="Password must contain at least one number,
one alphabet, one symbol, and be at
least 8 characters long" required />
<label for="repassword">Re-type Password:</label>
<input type="password" id="repassword" name="repassword" required />
<label for="mobile">Contact:</label>
<input type="text" id="mobile" name="mobile" maxlength="10" required />
<label for="gender">Gender:</label>
<select id="gender" name="gender" required>
<option value="male"> Male </option>
<option value="female"> Female </option>
<option value="other"> Other </option>
</select>
<button type="submit"> Submit </button>
</form>
</div>
</body>
</html>
Procedure:
- Start->All Programs->MS Office-> MS Word
- Open Microsoft Word and select "File" from the top menu. Then, click "New" and search for "business card" in the search bar.
- Choose a business card template that you like and click "Create." The template will open in a new document.
- Customize the template by replacing the placeholder text with your own information, such as your name, job title, and contact details. You can also change the font, font size, and color of the text to match your branding.
- Add any additional elements that you want to include on your business card, such as a logo or a background image. You can use Word's drawing and formatting tools to add these elements.
- When you are satisfied with your design, you can print your business card on cardstock paper or have it professionally printed.
- Click on Close button to exit from the MS Word.