olha este exemplo:
<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-type" content="text/html; charset=utf-8" />
<title>Seletor de Visualização</title>
<link rel="stylesheet" href="http://chocotemplates.com/preview/preview.css" type="text/css" media="all" />
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.6.2/jquery.min.js"></script>
<script src="http://chocotemplates.com/preview/preview.js" type="text/javascript"></script>
</head>
<body class="html">
<div id="customize">
<div id="customize-holder">
<h2>Compatibilidade</h2>
<div class="responsive">
<a href="#" rel="desktop">Desktop</a>
<a href="#" rel="tablet">Tablet</a>
<a href="#" rel="mobile">Mobile</a>
</div>
<h3>Selecione abaixo</h3>
<div class="colors">
<div class="cl"> </div>
<ul>
<li>
<a href="" class="color" style="color:#">
<strong>Visualizando...</strong>
</a>
<ol>
<li><a href="fone.htm">Fone</a></li>
<li><a href="beneficios.htm">Beneficios</a></li>
<li><a href="associe-se.htm">Associe-se</a></li>
</ol>
</li>
</ul>
<div class="cl"> </div>
</div>
</div>
</div>
<div class="iframe-holder">
<iframe id="frame" src="" width="100%" scrolling="auto" frameborder="0"></iframe>
</div>
</body>
</html>