Scribd
Upload
18 views8 pages

Code

The document contains the source code for a blog website with multiple pages including a home page, about page, and recent posts page. The source code includes HTML markup, CSS links, and content describing ways to find simplicity in various aspects of life like cooking, work, and home decoration.

Uploaded by

testing website
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
18 views8 pages

Code

The document contains the source code for a blog website with multiple pages including a home page, about page, and recent posts page. The source code includes HTML markup, CSS links, and content describing ways to find simplicity in various aspects of life like cooking, work, and home decoration.

Uploaded by

testing website
Copyright
© © All Rights Reserved
We take content rights seriously. If you suspect this is your content, claim it here.
Available Formats
Download as PDF, TXT or read online on Scribd
You are on page 1/ 8

Chapter 6

Source Code

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-
scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="style.css">
<title>Responsive Blog Website | Home</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesoe/5.11.2/css/all.min.css">
</head>
<body>

<header>
<div class="container container-nav">
<div class="site-title">
<h1>Squarespace</h1>
<p class="subtitle">A blog exporting minimalism in life</p>
</div>
<nav>
<ul>
<li><a href="" class="current-page">Home</a></li>
<li><a href="about.html">About me</a></li>
<li><a href="recent.html">Recent posts</a></li>
</ul>
</nav>
</div>
</header>

<div class="container container-flex">

<main role="main">

<article class="article-featured">
<h2 class="article-title">Finding simplicity in life</h2>
<img src="img/life.jpg" alt="greenery pic" class="article-image">
<p class="article-info">May 5, 2023 | 3 comments</p>
<p class="article-body">Life can get complicated really quickly, but it doesn't have to be! There are many
ways to simplify your life, a few of which we've explored in the past. This week we're taking a bit of a approach
through, in how you can find simplicity in the life you already leaving.</p>

9
<a href="#" class="article-read-more">CONTINUE READING</a>
</article>

<article class="article-recent">
<div class="article-recent-main">
<h2 class="article-title">Keeping cooking simple</h2>
<p class="article-body">Food is a very important part of everyone's life. If you want to be healthy, you
have to eat healthy. One of the easiest way to do that is to keep your cooking nice and simple.</p>
<a href="#" class="article-read-more">CONTINUE READING</a>
</div>

<div class="article-recent-secondary">
<img src="img/food.jpg" alt="" class="article-image">
<p class="article-info">May 1, 2023| 3 comments</p>
</div>
</article>

<article class="article-recent">
<div class="article-recent-main">
<h2 class="article-title">Simplicity and work</h2>
<p class="article-body">Work is often a major source of stress. People get frustrated, it ruins their
relationship with others and it leads to burnout. By keeping your work life as simple as possible, it will help
balance everything out.</p>
<a href="#" class="article-read-more">CONTINUE READING</a>
</div>

<div class="article-recent-secondary">
<img src="img/work.jpg" alt="" class="article-image">
<p class="article-info">April 25, 2023 | 3 comments</p>
</div>
</article>

<article class="article-recent">
<div class="article-recent-main">
<h2 class="article-title">Simple decoration</h2>
<p class="article-body">A home isn't a home untill you've decorated a little. People either don't
decorate, or they go overboard and it doesn't have the impact they were hoping for. Staying simple will help draw
the eye where you want it to and make things pop like never before.</p>
<a href="#" class="article-read-more">CONTINUE READING</a>
</div>

<div class="article-recent-secondary">
<img src="img/deco.jpg" alt="" class="article-image">
<p class="article-info">April 20, 2023 | 3 comment</p>
</div>
</article>

</main>

10
<aside class="sidebar">

<div class="sidebar-widget">
<h2 class="widget-title">ABOUT ME</h2>
<img src="img/about.JPG" alt="" class="widget-image">
<p class="widget-body"> Hello there!
Welcome to my Blogging site.</p>
</div>

<div class="sidebar-widget">
<h2 class="widget-title">RECENT POSTS</h2>

<div class="widget-recent-post">
<h3 class="widget-recent-post-title">Keeping cooking simple</h3>
<img src="img/food.jpg" alt="" class="widget-image">
</div>

<div class="widget-recent-post">
<h3 class="widget-recent-post-title">Simplicity and work</h3>
<img src="img/work.jpg" alt="" class="widget-image">
</div>

<div class="widget-recent-post">
<h3 class="widget-recent-post-title">Simple decoration</h3>
<img src="img/deco.jpg" alt="" class="widget-image">
</div>

</div>

</aside>
</div>

<footer>
<p><strong>Squarespace</strong></p>
<p>Copyright &copy; 2023</p>
<p>Made with <i class="fas fa-heart"></i> Devika Bhapkar</p>
</footer>
</body>
</html>

11
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-
scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="style.css">
<title>Responsive Blog Website | About Me</title>
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css">
</head>
<body>

<header>
<div class="container container-nav">
<div class="site-title">
<h1> Squarespace</h1>
<p class="subtitle">A blog exporting minimalism in life</p>
</div>
<nav>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="" class="current-page">About me</a></li>
<li><a href="recent.html">Recent posts</a></li>
</ul>
</nav>
</div>
</header>

<div class="container container-flex">

<main role="main">
<img src="img/about.JPG" class="image-full">

<h2>Hello there!</h2>

<p><strong>
Welcome to my blogging site. I am Devika Bhapkar author of this blogging site. I am starting my
blogging site. So, here I am, to share my knowledge.Hope your love and support stay forever with me.</p>

12
</main>

<aside class="sidebar">

<div class="sidebar-widget">
<h2 class="widget-title">RECENT POSTS</h2>

<div class="widget-recent-post">
<h3 class="widget-recent-post-title">Keeping cooking simple</h3>
<img src="img/food.jpg" alt="" class="widget-image">
</div>

<div class="widget-recent-post">
<h3 class="widget-recent-post-title">Simplicity and work</h3>
<img src="img/work.jpg" alt="" class="widget-image">
</div>

<div class="widget-recent-post">
<h3 class="widget-recent-post-title">Simple decoration</h3>
<img src="img/deco.jpg" alt="" class="widget-image">
</div>

</div>

</aside>
</div>

<footer>
<p><strong>Squarespace</strong></p>
<p>Copyright &copy; 2023</p>
<p>Made with <i class="fas fa-heart"></i> Devika Bhapkar&trade;</p>
</footer>
</body>
</html>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-
scale=1.0, minimum-scale=1.0">
<meta http-equiv="X-UA-Compatible" content="ie=edge">
<link rel="stylesheet" href="style.css">
<title>Responsive Blog Website | Recent Posts</title>

13
<link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/5.11.2/css/all.min.css">
</head>
<body>

<header>
<div class="container container-nav">
<div class="site-title">
<h1> Squarespace</h1>
<p class="subtitle">A blog exporting minimalism in life</p>
</div>
<nav>
<ul>
<li><a href="index.html">Home</a></li>
<li><a href="about.html">About me</a></li>
<li><a href="" class="current-page">Recent posts</a></li>
</ul>
</nav>
</div>
</header>

<div class="container container-flex">

<main role="main">

<article class="article-recent">
<div class="article-recent-main">
<h2 class="article-title">Finding simplicity in life</h2>
<p class="article-body">Life can get complicated really quickly, but it doesn't have to be! There are
many ways to simplify your life, a few of which we've explored in the past. This week we're taking a bit of a
approach through, in how you can find simplicity in the life you already leaving.</p>
<a href="#" class="article-read-more">CONTINUE READING</a>
</div>

<div class="article-recent-secondary">
<img src="img/life.jpg" alt="" class="article-image">
<p class="article-info">May 5, 2023 | 3 comments</p>
</div>
</article>

<article class="article-recent">
<div class="article-recent-main">
<h2 class="article-title">Keeping cooking simple</h2>
<p class="article-body">Food is a very important part of everyone's life. If you want to be healthy, you
have to eat healthy. One of the easiest way to do that is to keep your cooking nice and simple.</p>
<a href="#" class="article-read-more">CONTINUE READING</a>
</div>

<div class="article-recent-secondary">

14
<img src="img/food.jpg" alt="" class="article-image">
<p class="article-info">May 1, 2023 | 3 comments</p>
</div>
</article>

<article class="article-recent">
<div class="article-recent-main">
<h2 class="article-title">Simplicity and work</h2>
<p class="article-body">Work is often a major source of stress. People get frustrated, it ruins their
relationship with others and it leads to burnout. By keeping your work life as simple as possible, it will help
balance everything out.</p>
<a href="#" class="article-read-more">CONTINUE READING</a>
</div>

<div class="article-recent-secondary">
<img src="img/work.jpg" alt="" class="article-image">
<p class="article-info">April 25, 2023 | 3 comments</p>
</div>
</article>

<article class="article-recent">
<div class="article-recent-main">
<h2 class="article-title">Simple decoration</h2>
<p class="article-body">A home isn't a home untill you've decorated a little. People either don't
decorate, or they go overboard and it doesn't have the impact they were hoping for. Staying simple will help draw
the eye where you want it to and make things pop like never before.</p>
<a href="#" class="article-read-more">CONTINUE READING</a>
</div>

<div class="article-recent-secondary">
<img src="img/deco.jpg" alt="" class="article-image">
<p class="article-info">April 20, 2023 | 3 comment</p>
</div>
</article>

</main>

<aside class="sidebar">

<div class="sidebar-widget">
<h2 class="widget-title">ABOUT ME</h2>
<img src="img/about.JPG" alt="" class="widget-image">
<p class="widget-body">Hello there! Welcome to my Blogging site.</p>
</div>

<div class="sidebar-widget">
<h2 class="widget-title">RECENT POSTS</h2>

15
<div class="widget-recent-post">
<h3 class="widget-recent-post-title">Keeping cooking simple</h3>
<img src="img/food.jpg" alt="" class="widget-image">
</div>

<div class="widget-recent-post">
<h3 class="widget-recent-post-title">Simplicity and work</h3>
<img src="img/work.jpg" alt="" class="widget-image">
</div>

<div class="widget-recent-post">
<h3 class="widget-recent-post-title">Simple decoration</h3>
<img src="img/deco.jpg" alt="" class="widget-image">
</div>

</div>

</aside>
</div>

<footer>
<p><strong>Squarespace</strong></p>
<p>Copyright &copy; 2023</p>
<p>Made with <i class="fas fa-heart"></i> Devika Bhapkar&trade;</p>
</footer>
</body>
</html>

16

You might also like