プルダウンメニューを使って、スタイルシートファイルを切り替えます。
ファイルそのものを変更するため、ページ全体の装飾も変更することが出来ます。

サンプル

サンプルソース

JavaScript + CSS

<link rel="stylesheet" type="text/css" href="http://www.strollnet.com/js/jquery/css/chcss_default.css" id="StyleChange">
<script type="text/javascript">
<!--
	function StyleSet(StyleName) {
		document.getElementById('StyleChange').href = StyleName;
	}
// -->
</script>

HTML

<div class="stylesample">
	<p class="StyleSelect">
		スタイルシートを選択
		<select onchange="StyleSet(value);">
			<option value="http://www.strollnet.com/js/css/chcss_default.css"> 標準 </option>
			<option value="http://www.strollnet.com/js/css/chcss_blue.css"> 文字色を青にする </option>
			<option value="http://www.strollnet.com/js/css/chcss_size.css"> 文字サイズを大きくする </option>
			<option value="http://www.strollnet.com/js/css/chcss_black.css"> 背景を黒色にする </option>
			<option value=""> 無し </option>
		</select>
	</p>
	<p>
		CSSファイルを変更しているので、装飾を自由に変更できます。
	</p>
</div>