Показываем и редактируем элемент style

В данном уроке представлен небольшой трюк. Всем известно, что блок <style> можно размещать в разделе <head> HTML страницы для задания стилей. В действительности он может быть размещен в любом месте страницы. Это не правильно, но работает.

Что еще? Он такой же элемент, как и все остальные. Стилем по умолчанию во всех браузерах для него установлено display: none;.

Если вы переместите его в раздел body и установите свойство display: block;, то сможете увидеть код стиля, который используется  на странице.

body style {
        display: block;
        background: #333;
        color: white;
        font: 13px/1.8 Monaco, Mono-Space;
        padding: 20px;
        white-space: pre;
}

Что еще? Вы можете использовать атрибут HTML5 contenteditable, который позволит редактировать CSS прямо на странице, а изменения будут мгновенно вступать в действие.

<style contenteditable>body {
  background: green;
}</style>

Где такое можно использовать? Например в демонстрации кода CSS - не нужно будет повторять один и тот же код дважды, посетитель сможет его редактировать прямо на месте и видеть результат своих изменений.


Источник: http://feedproxy.google.com/~r/ruseller/CdHX/~3/AWZ-rTH44Kk/lessons.php

Читать комменты и комментировать

Добавить комментарий / отзыв



Защитный код
Обновить

Показываем и редактируем элемент style | | 2012-06-29 06:31:40 | | Статьи Web-мастеру | | В данном уроке представлен небольшой трюк. Всем известно, что блок можно размещать в разделе HTML страницы для задания стилей. В действительности он может быть размещен в любом месте страницы. Это не | РэдЛайн, создание сайта, заказать сайт, разработка сайтов, реклама в Интернете, продвижение, маркетинговые исследования, дизайн студия, веб дизайн, раскрутка сайта, создать сайт компании, сделать сайт, создание сайтов, изготовление сайта, обслуживание сайтов, изготовление сайтов, заказать интернет сайт, создать сайт, изготовить сайт, разработка сайта, web студия, создание веб сайта, поддержка сайта, сайт на заказ, сопровождение сайта, дизайн сайта, сайт под ключ, заказ сайта, реклама сайта, хостинг, регистрация доменов, хабаровск, краснодар, москва, комсомольск |
 
Поделиться с друзьями: