У меня нет Internet Explorer, чтобы играть с ним, поэтому я не могу точно сказать, будет ли этот метод работать, но вы можете вносить живые изменения на странице с помощью Chromium, Opera и Firefox (в Ubuntu 10.10), с в качестве примера:
<head>
<style contentEditable> <!-- note the 'contentEditable' -->
div {
clear: both;
width: 400px;
background-color: #f90;
}
</style>
</head>
<body>
<div id="test">
<p>This should start out orange. Ish. Please edit the above style to revise that, though.</p>
</div>
</body>
И с CSS:
style {
display: block; // <-- the important bit.
width: 100%;
margin: 0.5em 0;
padding: 0.5em 0;
border-bottom: 2px solid #000;
}
JS Fiddle demo
Отредактировано , чтобы отметить, что в Chromium, если не другие, использование возврата каретки в редактируемом блоке style на странице может вызвать проблемы.
Отредактировано , чтобы добавить, что хотя возврат каретки / перевод строки с использованием кнопки enter проблематичен, shift + enter работает нормально (по крайней мере, в Chromium и Firefox, другие, которые я не тестировал).
Обновлен демо JS Fiddle в ответ.