El pequeño cuadro de menú en la parte derecha le permite seleccionar la hoja
de estilos deseada. Esta selección es una pequeña rutina JavaScript (styleswitcher.js
)
que se ha almacenado en el subdirectorio /js
.
Aquí está el fragmento de código para hacer referencia a los distintos estilos y a la rutina en Javascript:
<link rel="stylesheet" type="text/css" href="css/basis1.css" media="screen, projection" title="Estándar">
<link rel="alternate stylesheet" type="text/css" href="css/blue.css" media="screen, projection" title="Bluesteel">
<link rel="alternate stylesheet" type="text/css" href="css/textonly.css" media="screen, projection" title="Invertido">
<link rel="stylesheet" type="text/css" href="css/druck.css" media="print">
<script type="text/javascript" src="js/styleswitcher.js"></script>
Preste atención a la asignación de diferentes "alternate stylesheet
"
y "title="..."
", así como la asignación de ""media="..."
".
Los enlaces son los siguientes:
<ul>
<li><a href="#" onclick="setActiveStyleSheet('EStándar'); return false;">Estándar</a></li>
<li><a href="#" onclick="setActiveStyleSheet('Bluesteel'); return false;">Bluesteel</a></li>
<li><a href="#" onclick="setActiveStyleSheet('Invertido'); return false;">Invertido</a></li>
</ul>
Este "switch" proporciona una funcionalidad adicional. En los navegadores modernos, puede elegir también la hoja de estilos desde el mismo navegador, por lo general en el menú "Ver|Estilo de página", que le ofrece los diferentes estilos y una opinión sin ofrecer estilos.