Created
May 21, 2020 14:33
-
-
Save harilee1325/57d91e3dd1c71994eca15d9b10986d81 to your computer and use it in GitHub Desktop.
This file contains bidirectional Unicode text that may be interpreted or compiled differently than what appears below. To review, open the file in an editor that reveals hidden Unicode characters.
Learn more about bidirectional Unicode characters
<!DOCTYPE html> | |
<html lang="en"> | |
<title>Blog</title> | |
<head> | |
<meta name="viewport" content="width=device-width, initial-scale=1"> | |
<link rel="stylesheet" href="https://www.w3schools.com/w3css/4/w3.css"> | |
<link rel="stylesheet" href="{{url_for('static', filename='css/style.css')}}"> | |
</head> | |
<body> | |
<ul> | |
<li><a href="{{url_for('album')}}">Album</a></li> | |
<li><a href="{{url_for('magazine')}}">Magazine</a></li> | |
<li><a class="active" href="{{url_for('blog')}}">Blog</a></li> | |
</ul> | |
<div class="w3-container w3-grey" style="position:relative"> | |
<a class="w3-btn w3-circle w3-xlarge w3-right w3-white" | |
style="position:absolute;top:126px;right:42px;"><i>+</i></a> | |
<h1 class="w3-jumbo w3-text-grey" style="text-shadow:1px 1px 0 #444">My Blog</h1> | |
</div> | |
<div class="w3-grey w3-animate-zoom" style="padding:20px 50px;background-image:url('pic_boat_portrait.jpg'); | |
background-size:cover;"> | |
<div class="w3-section w3-row-padding"> | |
<div class="w3-twothird"> | |
<div class="w3-card-4"> | |
<div class="w3-display-container"> | |
<img src="{{url_for('static', filename='img/one.jpg')}}" alt="Car" style="width:100%"> | |
<div class="w3-display-bottomleft w3-container w3-xlarge w3-text-black"> | |
<p>Nice Car</p> | |
</div> | |
</div> | |
<div class="w3-container w3-light-grey"> | |
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, | |
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> | |
<p>2 Hours Ago</p> | |
</div> | |
</div> | |
</div> | |
<div class="w3-third w3-container w3-center"> | |
<div class="w3-card-4"> | |
<div class="w3-container"> | |
<p class="w3-jumbo">✉</p> | |
<p class="w3-large">+ 1 334</p> | |
</div> | |
<div class="w3-container w3-white"> | |
<p>2 Hours Ago</p> | |
</div> | |
</div> | |
<div class="w3-card-4 w3-section"> | |
<div class="w3-container w3-white"> | |
<p class="w3-xxlarge">✉</p> | |
<p class="w3-large">+ 1 555</p> | |
</div> | |
<div class="w3-container"> | |
<p>3 Hours Ago</p> | |
</div> | |
</div> | |
</div> | |
</div> | |
<div class="w3-section w3-container"> | |
<div class="w3-card-4"> | |
<img src="{{url_for('static', filename='img/two.jpg')}}" alt="Disc" style="width:100%"> | |
<div class="w3-container w3-white"> | |
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, | |
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> | |
<p>Today</p> | |
</div> | |
</div> | |
</div> | |
<div class="w3-section w3-container"> | |
<div class="w3-card-4"> | |
<img src="{{url_for('static', filename='img/three.jpg')}}" alt="Snow" style="width:100%"> | |
<div class="w3-container w3-white"> | |
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, | |
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> | |
<p>Today</p> | |
</div> | |
</div> | |
</div> | |
<div class="w3-section w3-container"> | |
<div class="w3-card-4"> | |
<div class="w3-container w3-padding-16 w3-black w3-xxlarge"> | |
<p>«<i> Make it as simple as possible, but not simpler </i>»</p> | |
</div> | |
<div class="w3-container w3-white"> | |
<p>Lorem ipsum dolor sit amet, consectetur adipiscing elit, | |
sed do eiusmod tempor incididunt ut labore et dolore magna aliqua.</p> | |
<p>2 Days Ago</p> | |
</div> | |
</div> | |
</div> | |
</div> | |
</body> | |
</html> |
Sign up for free
to join this conversation on GitHub.
Already have an account?
Sign in to comment