<!DOCTYPE html>
<html>
<head>
<title>2K code</title>
<meta charset="utf-8" />
<meta name="author" content="2K code" />
<meta name="robots" content="noindex" />
<meta name="viewport" content="width=device-width" />
<script type="text/javascript">
function test(tab) {
var i, x;
x = document.getElementsByClassName("cont");
for (i = 0; i < x.length; i++) {
x[i].style.display = "none";
}
document.getElementById(tab).style.display = "block";
}
</script>
</head>
<body>
<h2>Tabs Simple</h2>
<button onclick="test('cont1')" style="background:#DDFFFF;padding:4px;border:0px"><i>I n f o</i></button>
<button onclick="test('cont2')" style="background:#FFDDDD;padding:4px;border:0px"><i>A b o u t</i></button>
<button onclick="test('cont3')" style="background:#DDDDFF;padding:4px;border:0px"><i>C o n t a c</i></button>
<span id="cont1" class="cont" style="height:24em;display:none;padding:16px;background:#DDFFFF">
<b>I n f o</b>
<p>Texto, Imágenes y contenidos de la sección 1 ...</p>
</span>
<span id="cont2" class="cont" style="height:16em;display:none;padding:16px;background:#FFDDDD">
<b>A b o u t</b>
<p>Texto, Imágenes y contenidos de la sección 2 ...</p>
</span>
<span id="cont3" class="cont" style="height:12em;display:none;padding:16px;background:#DDDDFF">
<b>C o n t a c</b>
<p>Texto, Imágenes y contenidos de la sección 3 ...</p>
</span>
</body>
</html>