|
Узнал с хабра о Zen Coding. Заинтересовался, что это такое. Какие-то непонятные символы, похожие на CSS и все радуются и благодарят автора(-ов), придумавшего(-их) Zen Coding… Погуглил. А теперь сам всем рекомендую. Эту идею действительно есть смысл продвигать в массы, чем я сейчас и займусь.
Итак, начнем. Чтобы лучше всего понять, рекомендую посмотреть видео.
Например. Открываем редактор, пишем там строчку:
div#content>h1+p
Жмем «Ctrl + ,» и строка разворачивается в код:
<div id="content">
<h1></h1>
<p></p>
</div>
Другими словами – мы коротко записываем выражение, жмем «секретную комбинацию» и получаем готовую болванку кода! Самый наглядный (и немного шокирующий пример) будет, если написать:
html:xt>div#header>div#logo+ul#nav>li.item-$*5>a
Жмём и получаем…
<!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» xml:lang=»en»>
<head>
<title></title>
<meta http-equiv=»Content-Type» content=»text/html;charset=UTF-8″ />
</head>
<body>
<div id=»header»>
<div id=»logo»></div>
<ul id=»nav»>
<li class=»item-1″><a href=»"></a></li>
<li class=»item-2″><a href=»"></a></li>
<li class=»item-3″><a href=»"></a></li>
<li class=»item-4″><a href=»"></a></li>
<li class=»item-5″><a href=»"></a></li>
</ul>
</div>
</body>
</html>
Удивительно, правда?  Zen Coding помогает сократить время написания кода… в разы! Поэтому рекомендуется к изучению. «Технология» новая, чтобы работала в вашем редакторе, понадобится скачать плагины.
Полный список плагинов есть тут: http://code.google.com/p/zen-coding/. Собственно, официальный сайт пока что не работает, поэтому и документацию Вы можете найти там же. Для каждого тега есть описание и его «короткий вариант». Например, простое «table+» даст нам:
<table>
<tr>
<td></td>
</tr>
</table>
Здорово, правда?
Чтобы попробовать, без установки плагинов в редактор, авторы создали демо-приложение в веб вот здесь. Это же и официальный сайт, но он пока что не работает.
Оставьте свой комментарий
|
12.03.2010 в 7:25 пп
13.03.2010 в 10:53 дп
13.03.2010 в 11:32 дп
Надо поискать такие штучки на Notepad++, Dreamweaver
13.03.2010 в 1:53 пп
У меня в их демо программе при нажатии на Ctrl + просто увеличивается масштаб и ничего не происходит.
13.03.2010 в 3:04 пп
13.03.2010 в 10:21 пп
15.03.2010 в 11:14 дп
27.03.2010 в 9:06 пп
27.03.2010 в 11:30 пп
а счас я мышкой куски кода перетаскиваю – набрать уже и строчку лень… проще открыть нужный файл и перенести что нужно
04.04.2010 в 9:33 дп
05.04.2010 в 6:41 дп