Skip to content

Instantly share code, notes, and snippets.

@dispeakble

dispeakble/index.html

Created April 30, 2020 10:41
Show Gist options
  • Star 0 You must be signed in to star a gist
  • Fork 0 You must be signed in to fork a gist
  • Save dispeakble/ede2c87a7ba1d41e05f32e8a5b8f9eb2 to your computer and use it in GitHub Desktop.
Save dispeakble/ede2c87a7ba1d41e05f32e8a5b8f9eb2 to your computer and use it in GitHub Desktop.
Download ZIP
// source http://jsbin.com
Raw
index.html
<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Simple HTML5 page </title>
</head>
<body>
<header>
<hgroup>
<h1> HTML5 AND CSS3 </h1>
<h2> A Simple HTML5 WITHOUT CSS</h2>
</hgroup>
<nav>
<ul>
<a href="">Home</a>
<a href="">Advance features</a>
<a href=""> About</a>
<a href=""> contact </a>
<a href=""> Sign in </a>
<a href=""> Sign up </a>
</ul>
</nav>
</header>
<section>
<h2>A Simple HTML5 Page</h2>
<p>
This is an example of a simple HTML5 webpage using some of it's basic elements.
</p>
</section>
<section>
<h2> CSS3 for Styling</h2>
<p>
To make this webpage visually appealing we'll use some of the basic CSS3 code in another example. CSS Makes styling of the page more easy and convinient.
</p>
</section>
<section>
<h2> Progress bar </h2>
<p>
Progress you'll make<br>
When you undertand HTML5 code<progress max="100" value=50></progress><br>
When you understand CSS3 Code <progress max="100" value=50></progress><br>
When you understand HTML5+CSS3 Code<progress max=100 value=100></progress>
</p>
</section>
<section>
<mark> For more understandibility how css works this page doesn't inlude any CSS3 code.</mark>
</section>
<footer>
<p>
This is the modified example of the code taught by Colleen van Lent in her Introduction to CSS3 course on coursera.</p>
</footer
<script id="jsbin-source-html" type="text/html"><!DOCTYPE html>
<html lang="en">
<head>
<meta charset="utf-8">
<title>Simple HTML5 page </title>
</head>
<body>
<header>
<hgroup>
<h1> HTML5 AND CSS3 </h1>
<h2> A Simple HTML5 WITHOUT CSS</h2>
</hgroup>
<nav>
<ul>
<a href="">Home</a>
<a href="">Advance features</a>
<a href=""> About</a>
<a href=""> contact </a>
<a href=""> Sign in </a>
<a href=""> Sign up </a>
</ul>
</nav>
</header>
<section>
<h2>A Simple HTML5 Page</h2>
<p>
This is an example of a simple HTML5 webpage using some of it's basic elements.
</p>
</section>
<section>
<h2> CSS3 for Styling</h2>
<p>
To make this webpage visually appealing we'll use some of the basic CSS3 code in another example. CSS Makes styling of the page more easy and convinient.
</p>
</section>
<section>
<h2> Progress bar </h2>
<p>
Progress you'll make<br>
When you undertand HTML5 code<progress max="100" value=50></progress><br>
When you understand CSS3 Code <progress max="100" value=50></progress><br>
When you understand HTML5+CSS3 Code<progress max=100 value=100></progress>
</p>
</section>
<section>
<mark> For more understandibility how css works this page doesn't inlude any CSS3 code.</mark>
</section>
<footer>
<p>
This is the modified example of the code taught by Colleen van Lent in her Introduction to CSS3 course on coursera.</p>
</footer
</body>
</html>
</script>
</body>
</html>
Sign up for free to join this conversation on GitHub. Already have an account? Sign in to comment