JSFiddle - React, Tailwind, and code Playground

by Patel1327

HTML

<h1>Dance</h1>
<h3>
There is a all infromation about our dance academy in Home , news and About us. you can just click all these bar to get more information.
</h3>
<section>
<ul>
<li><a href="">Home</a></li>
			<li><a href="">News</a></li>
			<li><a href="">About us</a></li>
      <header><h1>Get to know about dance.</h1></header>
		 <p>Dance is a performing art form.There are many different types of conpect to do dance,like ballet dance, freestyle and many more.</p>

		<p>In every country they have their own way to dance. they have different way to do dance. Example: In India people do classical dance..</p>		
		</ul>
  <li>Bharatnatyam</li>
  <li>jazz</li>
  <li>Hip-Hop</li>
   <li>Contemporary</li>
   <li>many more too.</li>
 
   
<img src="https://media.giphy.com/media/LqUhQIbbLFJWU/source.gif" alt="Dance" width="500" height="600">

<img src="https://tahomahigh.files.wordpress.com/2017/09/dance20team.jpg?w=595" alt="Dance" width="500" height="333">
<footer>
    	<p2>Content is &copy; Copyright Dance Academy.</p2>
</footer>

CSS

h1 {
			font: 210% arial, helvetica, sans-serif;
			margin: 20;
		}
h1 {
			background: #ccc;
		}
h1 {
  color: blue;
}
p1{
  color:red;
}
p1{
  font-size:20;
}
p{
  font-size:20;
}
p{
 color:red;
}
p1{
  background-color:yellow;
}	
    	nav {
			float: left;
			width: 170px;
		}
		
		section {
			left: 150px;
		}
    footer {
			clear: right;
			background:clear;
		}
		
		#footer p {
			margin: 1;
		}
    u1 {
       list-style-type: none;
    margin: 0;
    padding: 0;
    overflow: hidden;
    background-color: #333;
    }
    li a {
    display: block;
    color: Purple;
    text-align: center;
    padding: 14px 16px;
    text-decoration: underline overline wavy blue;
}
    li a:hover {
    background-color: #112;
}
  header h1 {
   Font: 100%
  }