Skip to content

Instantly share code, notes, and snippets.

@afaur
Created June 10, 2016 02:08
Show Gist options
  • Save afaur/200276972799db7f49d7342a5e8b2c91 to your computer and use it in GitHub Desktop.
Save afaur/200276972799db7f49d7342a5e8b2c91 to your computer and use it in GitHub Desktop.
<!DOCTYPE HTML>
<html>
<head>
<title>CSS SPA</title>
<style>
#content > #blog:not(:target) + #contact:not(:target) + #home,
#content > div:target {
display: block;
}
#content div:not(:target) {
display: none
}
</style>
</head>
<body>
<ul id="navigation">
<li><a href="#home">Home</a></li>
<li><a href="#blog">blog</a></li>
<li><a href="#contact">Contact</a></li>
</ul>
<div id="content">
<div id="blog">
This is the blog page
</div>
<div id="contact">
This is the contact page
</div>
<div id="home">
This is the home page
</div>
</div>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment