-
Notifications
You must be signed in to change notification settings - Fork 0
/
Copy pathblogpost.html
76 lines (65 loc) · 2.49 KB
/
blogpost.html
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
42
43
44
45
46
47
48
49
50
51
52
53
54
55
56
57
58
59
60
61
62
63
64
65
66
67
68
69
70
71
72
73
74
75
76
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">
<title>Blog Post Title</title>
<style>
/* Set dark blue background */
body {
font-family: Arial, sans-serif;
background-color: #2a6eff; /* Light Blue Background */
color: #ffffff; /* White Text */
margin: 0 2in; /* Two-inch margin on the sides */
padding: 20px; /* Add padding for better layout */
box-sizing: border-box; /* Include padding and border in total width and height */
}
/* Center text */
.center-text {
text-align: center;
margin-bottom: 20px; /* Add margin-bottom for spacing */
}
/* Style for tags */
.tags {
margin-top: 20px;
text-align: center;
}
/* Style for individual tags */
.tag {
background-color: #666699; /* Purple background for tags */
color: #ffffff; /* White text for tags */
padding: 5px 10px; /* Padding for tags */
margin: 5px; /* Margin for spacing between tags */
border-radius: 5px; /* Rounded corners for tags */
}
/* Style for image */
img {
display: block;
margin-left: auto;
margin-right: auto;
max-width: 100%; /* Responsive image */
height: auto; /* Maintain aspect ratio */
}
</style>
</head>
<body>
<!-- Tags -->
<div class="tags">
<span class="tag">Technology</span>
<span class="tag">MacBook</span>
<span class="tag">Design</span>
</div>
<!-- Title -->
<h1 class="center-text">Exploring the Design of MacBook</h1>
<!-- Image of MacBook -->
<div class="center-text">
<img src="images/macbook-image.jpg" alt="MacBook Image" width="600">
</div>
<!-- Body Text -->
<p>The MacBook is renowned for its sleek design, cutting-edge technology, and user-friendly interface. This blog post delves into the intricate details of the MacBook's design, highlighting its unique features, aesthetics, and functionality.</p>
<p>From its aluminum unibody construction to its Retina display and ergonomic keyboard, the MacBook exemplifies innovation and elegance in the realm of technology. The seamless integration of hardware and software components enhances performance, efficiency, and user experience, making it a preferred choice for professionals, creatives, and tech enthusiasts alike.</p>
<!-- Centered Text -->
<div class="center-text">
<p>This blog post aims to provide insights into the design philosophy, engineering marvels, and user-centric approach adopted by Apple in crafting the MacBook, setting it apart as a symbol of excellence, innovation, and craftsmanship in the tech industry.</p>
</div>
</body>
</html>