Zen coding — пишем HTML/CSS быстрее

    Добрый день смотрим сразу как это работает:



    Zen Coding
    chikuyonok — Сергей Чикуёнок
    pepelsbey — Вадим Макеев

    Этот способ ускоренного написания HTML и CSS кода разрабатывается Сергеем Чикуёнком, который «знает толк в извращениях».

    HTML код пишется на CSS манеру:
    div#content>h1+p

    Нажимаем нехитрое комбо на клавиатуре (Ctrl+,) и получаем результат:
    <div id="content">
        <h1></h1>
        <p></p>
    </div>

    Первоначальная концепция была предложена Вадимом Макеевым в статье Zen Coding 2.0. Концепт в апреле 2009 года. Затем Сергей Чикуёнок, занимался развитием этого проекта и сейчас он обрел зрелые формы и очертания.

    Попробовать можно все на демо-странице
    Сайт Zen Coding скоро заработает.

    Скачиваем плагины с полной поддержкой:

    И частичной поддержка:

    Статья «Zen Coding: A Speedy Way To Write HTML/CSS Code» взята с smashingmagazine.com, кому интересно там есть продолжение с примерами, но я думаю из видео итак многое понятно.

    P.S. По поводу частичная не частичная поддержка, пишите в комментариях.

    Update (выдержки из комментариев):
    pepelsbey
    Кстати, у проекта есть официальный твиттер: @zen_coding

    batonius
    Все тоже, плюс есть предпросмотр результата в процессе набора.
    www.emacswiki.org/emacs/ZenCoding
    А вот демка

    crizis
    Описание функций на русском

    Ваш Николай из Компании M2
    Поделиться публикацией

    Похожие публикации

    Комментарии 175
      –5
      спасибо. но меня и обычный html не напрягает, а тут еще изучать что-то
        +10
        это ведь css-подобный синтаксис, тут учить то нечего.
        Мне вот надо список с ссылками для меню, я набираю «ul>li*5>a» и жму Ctrl+,

        Скажем скорость повышается раз так в 10 =)
          –1
          Да, но не всегда скорость важна… если работаете на время :)
        +3
        Хорошая вещь, установлена у меня в аптане. Жаль нет под легковесный notepad++
          0
          habrahabr.ru/blogs/webdev/56396/
          В этом топике что-то об этом обсуждали
            +2
            Подскажите пожалуйста как поставить в Аптане, наверное или scripts или plugin.
              0
              Скачиваете файлы скрипта, распаковываете и кладете в папку с проектом (в директорию scripts или monkey). Проект в IDE просто обновляете, ничего перезагружать не нужно.
            +5
            Класс, гениально. Подскажите, а для vim подобное планируется?
            0
            Очень круто :) Даже жаль, что я сейчас не занимаюсь вебом)
              0
              Расскажите знакомым, пусть порадуются)
                +1
                Ага, расскажу в группе)
              +1
              А функция «ролл-бэка» есть? То есть, классическое написание кода свернуть в «аббревиатуру».
                +1
                Тут цель написание html, если написали что-то не так, то просто Команд+Z и исправляем. Преобразовывать весь код — это надо Haml & Saas, всякие вкусные плюшки там.
                0
                наверное это ускоряет работу, но html и без этого очень просто легкий язык.
                  +3
                  Само написание html подвергается критике уже очень давно.
                  Haml и Saas не просто так появились
                  haml.hamptoncatlin.com/
                    +1
                    интересный проекты. но жаль ничего подобного не смогу использовать со своим EditPlus.

                    но все равно считаю это «Масло масленое»
                    пишем на одном языке после нажатия Ctrl+, появился html и уже приходится работаться с html
                    да это на самом начальном этапе может и ускорить работу, но у меня для этого есть обычный начальный шаблон.

                    хотя признаюсь конструкция ul>li*5>a очень прикольная :)
                      +1
                      Считайте это тоже шаблончиками, маленько и приятненько.
                      Сергей Чикуёнок — это человек, который вроде в студии Лебедева технический консультант, его не назавешь начинающим)
                        0
                        Думаю, что подразумевают не начинающего разработчика, а начальный этап разработки :-)
                      +1
                      Может вы имели ввиду sass (http://sass-lang.com/)?
                        0
                        Очепятка, простите.
                    • НЛО прилетело и опубликовало эту надпись здесь
                        –2
                        а чем простые автозамены не устраивают?
                        b — <b></b>
                        a — <a href=""></a>

                        хотя это дело вкуса. каждому свое.
                          0
                          Никто не мешает использовать zen для «простых автозамен». В чем проблема?
                      +4
                      А при чем тут Ваша «Компания М2»?

                      ЗЫ. Кстати, сам Сергей вроде как на Хабре зарегистрирован, интересно, почему он об этом не написал еще…
                        –1
                        Ну вдруг кому-нибудь пригодится
                        Сергей написал на smashingmagazine.com, быть может он на хабре не очень сидит.
                          +4
                            0
                            Ребята, вы волшебники. Идея офигенная.
                              +1
                              Ещё бы одну фичу добавить в современныех хтмл-редакторы — удаление тегов без удаления вложенных.
                              Типа: text ставим курсор на span, жмём кнопку и получаем text. Хотя может такое и есть где-то.
                                +9
                                Как раз собирался в следующей версии такую штуку сделать
                                  0
                                  Упс. За теги забыл совсем. Хабр их пожрал. А с отступами там будет порядок?

                                  И ещё бы пару кнопок, чтобы отступы править. Выделил блок, сдвинул всё вправо или влево.

                                  Такой онлайн редактор для любой цмски будет золото.
                                    +1
                                    А с отступами там будет порядок?

                                    Это одна из сложностей, которая не позволяет сделать это быстро :)

                                    И ещё бы пару кнопок, чтобы отступы править. Выделил блок, сдвинул всё вправо или влево.

                                    Этим должен заниматься непосредственно редактор, сам ZC в это не вмешивается. У меня есть планы написать совсем простой редактор, который будет работать в <textarea>. Чтобы без проблем встраивать на сайты и не утяжелять страницу.
                                      –1
                                      Может стоит из спаркапа позаимствовать такую плюшку? ul#menu>li.item>a{Пункт $}

                                      И его "<" тоже добавляет гибкости, правда затрудняет читаемость.
                                        +1
                                        Ни я, ни Вадим не хотим превращать ZC в новый язык программирования. Какие-то работы по улучшению синтаксиса планируются, но в спаркапе явный перебор. Сначала подумать, какой HTML-код нужно получить, потом подумать, какая аббревиатура должна быть для него.

                                        Тем более в спаркапе возникла концептуальная проблема из-за символа '<': существующие тэги (например <div>) будут заглатываться парсером. Поэтому там все аббревиатуры нужно писать с новой строки. В ZC такой проблемы нет: тэги отделяются от аббревиатуры.
                                          0
                                          Всё-таки tag{some text} иногда было бы полезно имхо.

                                          А «<» можно заменить тем же плюсом:
                                          a>b+c:
                                          <a>
                                            <b></b>
                                            <c></c>
                                          </a>

                                          a>b++c:
                                          <a>
                                            <b></b>
                                          </a>
                                          <c></c>

                                          И скобки не нужны.
                          0
                          Что-то не получается запустить в NetBeans, а вот в gedit работает отлично! :-)
                          0
                          > разрабатывается Сергеем Чикуёнок

                          Мужские фамилии в русском языке всегда склоняются.
                          Так что «Сергеем Чикуёнком», хоть и непростая фамилия )
                            0
                            Извините, спасибо что подсказали, сейчас исправлю
                              0
                              Я думаю вас тоже надо вписать в пост, вы ведь наверно одну из главных рлей занимали последние пол года?
                              Можете рассказать?
                                +1
                                Поскольку я не программист, то я физически не мог написать такой сложный скрипт, да ещё и заниматься портированием на всевозможные редакторы. Спасибо Сергею, что он взялся и воплотил мои мечтанья в жизнь.

                                Сейчас я занимаюсь поддержкой документации, контактами с разработчиками, которые хотят портировать этот принцип для своих редакторов, а также поддержкой самого проекта на Google Code.

                                Кстати, у проекта есть официальный твиттер: @zen_coding
                              • НЛО прилетело и опубликовало эту надпись здесь
                                  0
                                  >> Мужские фамилии в русском языке всегда склоняются.

                                  Нет, не всегда верно. Если фамилия на "-ых" (Бесчастных), то в таком случае, фамилия не склоняется ;)
                                    0
                                    Я не сомневаюсь, что есть исключения.
                                    Было озвучено базовое правило.
                                    0
                                    Ага, самое оно =) под него есть снипеты и Zen coding
                                    +2
                                    Странно, что пост ещё не на главной.
                                      +1
                                      Дак да, обидно как-то даже
                                      • НЛО прилетело и опубликовало эту надпись здесь
                                          0
                                          у меня сейчас кармы 4.9, но в веб разработку не пускает, говорит мало
                                          • НЛО прилетело и опубликовало эту надпись здесь
                                              0
                                              Большое спасибо, поправил ссылку, пишите если что еще заметите.
                                          +1
                                          Представляете, я понял что вы из Перми по фразе — «дак да» :-)
                                            0
                                            Ох)
                                            а вы не из таго Аурума, который занимается дизайном интерьеров?
                                              0
                                              Не от туда.
                                                0
                                                Дак нет ;-)
                                        0
                                        Отлично!
                                        Кстати, а нельзя еще сделать под Kate/Kwrite?
                                        • НЛО прилетело и опубликовало эту надпись здесь
                                          • НЛО прилетело и опубликовало эту надпись здесь
                                            • НЛО прилетело и опубликовало эту надпись здесь
                                                0
                                                Проблема в горячей клавише.
                                                Найдите в файле __init__.py строчку:

                                                action_group.add_action_with_accel(complete_action,
                                                «E»)

                                                И замените «E» на незанятую горячей клавишей букву.
                                                  0
                                                  По крайней мере, у меня после этого заработало. Конфликтовало с горячей клавишей другого расширения. Gedit 2.28.2
                                                  • НЛО прилетело и опубликовало эту надпись здесь
                                                      0
                                                      Кстати да. Есть баг. Если перед выражением, которое нужно развернуть, есть табы — не работает.
                                            +5
                                            Меня как-то не попер Zen Coding, а вот Zen HTML и Zen CSS уже год пользуюсь.

                                            Скажите, Николай. Кто вас учил тэги к постам ставить? Какое, нахер, отношение ваша компание имеет к Zen Coding'у? Лучше бы все редакторы перечилсили, а не пиарились за чужой счет.
                                              +2
                                              Вать Машу! Это, как минимум, гениально!
                                              После просмотра видео все сомнения в этом улетучились мгновенно
                                                +1
                                                Меня как-то не попер Zen Coding, а вот Zen HTML и Zen CSS уже год пользуюсь.

                                                Скажите, Николай. Кто вас учил тэги к постам ставить? Какое, нахер, отношение ваша компание имеет к Zen Coding'у? Лучше бы все редакторы перечилсили, а не пиарились за чужой счет.
                                                  0
                                                  думал haml клон, аннет. Прикольная вещь
                                                    +1
                                                    Сколько людей, столько и мнений.
                                                    Не могу понять, чего же тут такого сверхъестественного, чему тут дифирамбы петь.
                                                    Я выучил шорткаты в своем редакторе — для меня работает быстрее и понятнее
                                                      0
                                                      Для каждого элемента шорткат не напишешь.
                                                      А тут — полный доступ к HTML и CSS.
                                                        –2
                                                        На глаз не могу вспомнить больше 10 тегов, которыми пользовался в 90% случаев последние 3 года минимум, для них достаточно хоткеев

                                                        по-вашему это будет:
                                                        ⇩⇩⇩⇩⇩⇩⇩⇩⇩⇩⇩⇩⇩⇩
                                                        нгнмвбдткпвдпсптгм
                                                          +1
                                                          Ок, сколько движений нужно, чтобы написать в вашем редакторе открывающий и закрывающий элемент <blockqoute> и поставить курсор между тегами?

                                                          У меня ровно три клавиши: bq + tab.

                                                          И это демонстрация самого базового принципа, без ID'шников, без классов, без селекторов повтора.
                                                            0
                                                            Ну, скажем, я редко сталкиваюсь с этим тегом, вот только что попробовал
                                                              0
                                                              Понимаю, всё зависит от тематики сайтов.
                                                              Но те же таблицы?

                                                              table+ делает полноценную таблицу, как и dl+, ul+, ol+ делают списки.
                                                                0
                                                                Ctrl+T делает полноценную таблицу
                                                                Ctrl+U делает полноценный список

                                                                А вообще, спор, скажем так, о том «кто как кое что делает» :D — это же личное
                                                                Парсер съел, черт побери, предыдущий комментарий.

                                                                Не могу отвечать чаще, чем раз в 5 минут, к сожалению :)
                                                                  0
                                                                  Ладно, каждый **чит как он хочет, если я правильно вас понял ;)
                                                                  Согласен.

                                                                  Я начал писать первую версию плагинов для Zen Coding тогда, когда у меня начали кончаться горячие клавиши. И я пришёл к тому, что они мне практически не нужны.

                                                                  В общем, миру-мир, но вы попробуйте ;)
                                                            +3
                                                            Примера со стрелочками категорически не понял.
                                                        +1
                                                        А поддержка Notepad++ планируется?
                                                          +1
                                                          habrahabr.ru/blogs/webdev/56396/
                                                          В этом топике обсуждали, можно связаться с автором, узнать как успехи.
                                                          +2
                                                          'Course, there is an emacs mode to do that. © xkcd.com/378/

                                                          www.emacswiki.org/emacs/ZenCoding
                                                          А вот демка www.youtube.com/watch?v=u2r8JfJJgy8
                                                          Все тоже, плюс есть предпросмотр результата в процессе набора.
                                                            +3
                                                            AWESOME!
                                                            Вот бы еще более полную поддержку этого счастья в NetBeans

                                                            Кстати, никто не хочет написать плагины под DreamWeaver или emEditor?
                                                            • НЛО прилетело и опубликовало эту надпись здесь
                                                                0
                                                                  0
                                                                  Спасибо! Буду смотреть
                                                                    0
                                                                    А какие сочетания клавиш на маке?
                                                                      0
                                                                      сочетания клавиш нужно самому настроить в Edit > Keyboard Shortcuts для Commands>Expand Abbreviation
                                                                        0
                                                                        А у меня не работает.
                                                                        Пишу div>a, [выделяю,] выбираю мышкой меню Expand Abbreviation — ничего не происходит.
                                                                        CS4, mac os leopard
                                                                          0
                                                                          На пустом документе действительно работает
                                                                          • НЛО прилетело и опубликовало эту надпись здесь
                                                                              0
                                                                              у вас тоже CS4 на Mac OS Leopard?
                                                                              • НЛО прилетело и опубликовало эту надпись здесь
                                                                                • НЛО прилетело и опубликовало эту надпись здесь
                                                                                    0
                                                                                    новерное нужно парсить только выделеный диапазон
                                                                    0
                                                                    Всё-таки я консерватор.
                                                                      0
                                                                      Особенность этой штуки состоит в том, что она не мешает писать код как обычно.
                                                                      Можно пользоваться совсем базовыми вещами, вроде html:5 (получаем шаблон документа) или bga:f (background-attachment:fixed) — даже это дико сокращает время набора кода.
                                                                        –2
                                                                        А почему не bg-a:f

                                                                        Высосано из пальца, во всех более-менее профессиональных вещах есть автоподстановка и пр…
                                                                          +1
                                                                          Все автоподстановки тупы как дрова.
                                                                          Пример:

                                                                          Хочу я написать в CSS-коде «width».
                                                                          Пишу «w» — предлагает первый вариант «widows», пишу «wi», пишу «wid»…
                                                                          Т.е. все автоподстановки работают по алфавиту, а не по принципу частотности употребления.

                                                                          А в Zen Coding? «w + tab»
                                                                            –2
                                                                            Подстановщики, бесспорно, тупы, но можно и промотать и написать на две буквы больше, что в конечном итоге даст ту же самую скорость

                                                                            А теперь представьте строчку такой вышеприведенной белиберды, в которой, например, неверна одна буква — вот что в таком случае делать
                                                                              +1
                                                                              Если для вас строчка p+p или ul>li выглядит тупой, наверное вы много верстали под IE6 ;)

                                                                              Естественно, что все начали демонстрировать приёмы высшего пилотажа и пытаться написать весь сайт одной строкой. Но это чушь и блажь. Главный плюс Zen Coding'а как раз в этих маленьких помощниках, которые облегчают скорость набора кода.

                                                                              Честно говоря, я сам больше пользуюсь и радуюсь сокращениями для CSS, поскольку HTML код пишется два-три раза, а потом начинается длинная возня со стилями. И если я не помню сколько там параметров у text-shadow, я просто пишу tsh+ и радуюсь жизни: text-shadow:0 0 0 #000
                                                                                –2
                                                                                Не переводите тему, что будет при опечатке — вот вся ваша скорость устремляется в минус бесконечность в попытке понять, что же неправильно набрано

                                                                                  +1
                                                                                  Ок.

                                                                                  Каков шанс ошибиться в комбинации table+ или ul+li? Близкий к нулевому.

                                                                                  А вот, например, каков шанс написать backgronud-attachment:fiksed? Довольно большой. А благодаря Zen Coding вам не нужно запоминать точное написание, поскольку bga:f и всё.

                                                                                  Так что ваша критика про опечатки обернулась в мою сторону.
                                                                                    –2
                                                                                    Набрав 4 первые буквы «back» мне был выдан выпадающий список с перечислением свойств, где background-attachment был второй сверху, я нажал кнопку «вниз», потом «enter» — свойство дописалось целиком, выдав выпадающий список значений

                                                                                    По поводу width… widows — меня тоже это бесило — я залез в папку с редактором и увидел, что определения лежат в текстовых файлах, поменял порядок и всё…

                                                                                    Опять спор о курице и яйце :)
                                                                                    0
                                                                                    undo → исправляем опечатку → expand abbreviation
                                                                                    И да, как правильно заметил Вадим: люди реально начинают воспринимать ZC как новый язык разметки и просить расширить его так, чтобы действительно можно было написать сайт одной строкой. Лично я не пишу больше 4 элементов подряд в аббревиатуре.

                                                                                    Я, кстати, тоже сначала скептически относился к ZC, но распробовав теперь не могу слезть с него. Мне теперь ни code complete, ни автозакрытие тэгов не нужны. Сособенно с учетом того, что 60% своего времени я трачу на работу с HTML/CSS/XML/XSL
                                                                        0
                                                                        Кстати, а вот и Zen Coding для UltraEdit: www.ultraedit.com/forums/viewtopic.php?f=52&t=8819
                                                                          0
                                                                          А есть что-нибудь подобное для Visual Studio?
                                                                          0
                                                                          Не, ну это, как бы, просто шикарно. Теперь таблицы будут писаться одной строкой.
                                                                            0
                                                                            в Homesite это было реализованно еще очень давно, странно только что когда их купила macromedia, а в последствиии adobe никто это в дримвивер не встроил
                                                                              0
                                                                              Протестировал на Coda — ОХРЕНИТЕЛЬНО!
                                                                              Огромное спасибо.
                                                                                +1
                                                                                Думаю написать обзор плагинов для коды. Втему будет?
                                                                                  +1
                                                                                  Безусловно, это интересный материал для людей только обративших внимание на Coda, поскольку часто упрощают жизнь.
                                                                                  Я уже использую несколько плагинов, но про представленный в топике узнал только сегодня.

                                                                                  Кстати, мне кажется стоит дать в посте ссылку на русское описание инструкций, которые работают в этом плагине: code.google.com/p/zen-coding/wiki/ZenHTMLElementsRu
                                                                                    0
                                                                                    Добавил ваш материал
                                                                              • НЛО прилетело и опубликовало эту надпись здесь
                                                                                  0
                                                                                  С рельсами я бы советовал юзать Haml. Сразу писать и править на нем очень удобно, читабильность на высоте. Переучиватся не долго
                                                                                    +2
                                                                                    Да, как только зачиним youtrack.jetbrains.net/issue/WI-626
                                                                                    0
                                                                                    Охренительно!
                                                                                    Только вот написано плагин для Coda с полной поддержкой — а у меня не получается с CSS, работает только с HTML :(
                                                                                      0
                                                                                      Я CSS пока отключил. От там бы в виде хака: сниппеты HTML наследовались от CSS, поэтому казалось, что все работает. Пока несколько человек не написало, что по аббревиатуре 'p' получали padding вместо <p> :)

                                                                                      К сожалению, пока не знаем способа, как определить текущую зону редактирования (HTML, CSS, JS) в Coda, поэтому работает только HTML
                                                                                        0
                                                                                        Может быть, для начала смотреть на тип файла, либо на выбранный в Коде синтаксис? (чисто теоретические предположения, не знаю, можно ли это реализовать)
                                                                                          0
                                                                                          Проблема в том, что на одной странице может быть и CSS, и HTML, и JS. А с типами файлов — да, попробую что-нибудь сделать с этим
                                                                                            0
                                                                                            Ну я предложил для начала. Чтобы хоть как-то было :)
                                                                                          0
                                                                                          Добавьте pa = padding и ma = margin.
                                                                                        0
                                                                                        Что за редактор на видео?
                                                                                        0
                                                                                        Есть возможность использовать Zen coding в Eclipse без Aptana, для этого нужно:
                                                                                        1) установить плагин Eclipse Monkey (update).
                                                                                        2) скачать Zen.Coding-Aptana с сайта Zen Coding.
                                                                                        3) создать папку «scripts» в корневой директории проекта и разархивировать в неё JS-скрипты из Zen.Coding-Aptana.
                                                                                        далее:
                                                                                        div#content>h1+p (Alt+E)
                                                                                          0
                                                                                          Пришлось немного погуглить, так что напишу сюда:
                                                                                          Меню Help → Install New Software, адрес zen-coding.ru/eclipse/updates/.
                                                                                          0
                                                                                          Юзаю шорткаты в Scite, правда, штуки вроде ul#id>li не работают, но зато есть сокращения для css, html, php и еще чего-то, сам не помню чего :) И не надо запускать тяжеленную ИДУ.
                                                                                            –2
                                                                                            Подскажите пожалуйста, а что за редактор на видео?
                                                                                            0
                                                                                            Вдохновился и написал подобное для своей любимой IDE: Nusphere PHPEd.
                                                                                            Можно взять тут: pastebin.com/f5c18ce49
                                                                                            Для использование кидаем скрипт в любую директорию, прописываем в Tools новую команду: @php@ -q %path_to_file%

                                                                                            Для использования пишем, выделяем выполняем команду.
                                                                                              0
                                                                                              А не хотите официально поддерживать скрипт в рамках Zen Coding и выложить его на Google Code?
                                                                                                0
                                                                                                Готов участвовать. Только такие возможности, как в скринкасте мой плагин пока не предоставляет. Некоторые и невозможны из-за ограничений самой IDE.
                                                                                                  0
                                                                                                  Напишите мне о том, что в итоге поддерживается — у нас там есть несколько проектов, которые частично воспроизводят функциональность, но и это уже что-то. Почта в профиле.
                                                                                              0
                                                                                              Скажите, пожалуйста.
                                                                                              Я что-то не так делаю, или у всех в Coda работают не все функции так, как на видео?

                                                                                              Например, такой синтаксис:

                                                                                              item 1
                                                                                              item 2
                                                                                              item 3

                                                                                              при попытке обернуть в ul>li ломает код, т.к. открывается окно, где подразумевается введение только одного тега, например li. При введении ul>li он ломает код, эта строка не преобразовывается, а тупо вставляется в исходном виде.

                                                                                              Второе, не критично, но очень часто код получается inline, без переносов и табуляции.

                                                                                              Третье — нет быстрого перемещения между точками ввода текста, например внутри href="" и текста ссылки. Или я не нашел? В меню нет, сам пробовал разные комбинации, не работает.
                                                                                                0
                                                                                                при попытке обернуть в ul>li ломает код, т.к. открывается окно, где подразумевается введение только одного тега, например li. При введении ul>li он ломает код, эта строка не преобразовывается, а тупо вставляется в исходном виде.

                                                                                                Можете написать, как именно ломается код (какой получаемый результат)? И если вы хотели обернуть каждую строку в <li>l, то правильный синтаксис — ul>li* (звёздочка на конце)

                                                                                                Второе, не критично, но очень часто код получается inline, без переносов и табуляции.

                                                                                                На какой именно аббревиатуре так получается? Не форматируются инлайн-элементы (иногда это правильно, иногда — нет), работаю в этом направлении

                                                                                                Третье — нет быстрого перемещения между точками ввода текста, например внутри href="" и текста ссылки. Или я не нашел? В меню нет, сам пробовал разные комбинации, не работает.


                                                                                                Перемещается по клавише Tab

                                                                                                  0
                                                                                                  Вру — перемещение по Tab в Coda не работает :( Работаем над этим
                                                                                                    0
                                                                                                    Даже если использовать предложенный Вами синтаксис: ul>li*

                                                                                                    Не работают у меня здесь html-теги почему-то.
                                                                                                    Часть кода хаб сжирает.

                                                                                                    В общем, каждая строчка оборачивается в конструкцию (использую елочки):

                                                                                                    «ul»li*>item 1«/ul»

                                                                                                    Т.е. строка вставляется как есть, без обработки.
                                                                                                      0
                                                                                                      напишите мне на serge.che@gmail.com — попробуем решить проблему, не разводя тут флейма
                                                                                                  0
                                                                                                  Espresso на сочетание Ctrl+, выдает такое:

                                                                                                  Exception Message: <class 'xml.parsers.expat.ExpatError'>: not well-formed (invalid token): line 2586, column 11

                                                                                                  Method Trace:
                                                                                                  NSExceptionHandlerExceptionRaiser (in ExceptionHandling) + 185
                                                                                                  objc_exception_throw (in libobjc.A.dylib) + 40
                                                                                                  -[NSException raise] (in CoreFoundation) + 17
                                                                                                  PyObjCErr_ToObjCWithGILState (in _objc.so) + 63
                                                                                                  signature_to_ffi_return_type (in _objc.so) + 2562
                                                                                                  ffi_prep_cif_machdep (in _objc.so) + 358
                                                                                                  -[EKActionMenuController performMenuItemAction:] (in Espresso) + 240
                                                                                                  -[NSApplication sendAction:to:from:] (in AppKit) + 112
                                                                                                  -[NSMenu performActionForItemAtIndex:] (in AppKit) + 493
                                                                                                  -[NSCarbonMenuImpl performActionWithHighlightingForItemAtIndex:] (in AppKit) + 220
                                                                                                  -[NSMenu performKeyEquivalent:] (in AppKit) + 866
                                                                                                  -[NSApplication _handleKeyEquivalent:] (in AppKit) + 492
                                                                                                  -[ESApplication _handleKeyEquivalent:] (in Espresso) + 56
                                                                                                  -[NSApplication sendEvent:] (in AppKit) + 3997
                                                                                                  -[NSApplication run] (in AppKit) + 867
                                                                                                  NSApplicationMain (in AppKit) + 574
                                                                                                  start (in Espresso) + 54
                                                                                                  0x2
                                                                                                    0
                                                                                                    Все. Починил полной переустановкой программы.
                                                                                                    –2
                                                                                                    Иногда привыкание к такому методу написания может привести к плохим последствиям, например когда под рукой не окажется такого софта :)
                                                                                                      0
                                                                                                      а под intype портируемо?
                                                                                                        –3
                                                                                                        Неужели кто-то кодит еще руками.
                                                                                                          +1
                                                                                                          Нет, за нас теперь всё делают машины xD
                                                                                                          +1
                                                                                                          Хм… а как записать код вида
                                                                                                          <div class='wrapper'>
                                                                                                          <div class='head'>
                                                                                                          <div id='hello'>

                                                                                                          </div>
                                                                                                          <div class='bodydiv'>
                                                                                                          </div>
                                                                                                          </div>
                                                                                                          ? (естественно речь идёт об одной аббривиатуре)
                                                                                                            +1
                                                                                                            Ой, вот так вот:
                                                                                                            <div class='wrapper'>
                                                                                                            <div class='head'>
                                                                                                            <div id='hello'></div>
                                                                                                            </div>
                                                                                                            <div class='bodydiv'>
                                                                                                            </div>
                                                                                                            </div>
                                                                                                            
                                                                                                              +1
                                                                                                              В 2 шага:
                                                                                                              — div.wrapper>div.head>div#hello
                                                                                                              — div.bodydiv

                                                                                                              Я так понимаю, Zen-Coding сделан для упрощения ввода, а не для того, чтоб разметку страницы одним выражением зафигачить.
                                                                                                                +1
                                                                                                                естественно речь идёт об одной аббривиатуре
                                                                                                                В несколько неинтересно :)
                                                                                                                Я так понимаю, Zen-Coding сделан для упрощения ввода, а не для того, чтоб разметку страницы одним выражением зафигачить.
                                                                                                                Я просто понял так, что основную разметку написать сразу в одно выражение… это и есть упращение ввода…
                                                                                                                В данном случае просто не хватает каких-нибудь «группирующих скобок»…
                                                                                                                  +1
                                                                                                                  Что-то я по клавишам не попадаю o_O
                                                                                                                  естественно речь идёт об одной аббривиатуре
                                                                                                                  В несколько неинтересно :)

                                                                                                                  Здесь я хотел написать вот так:
                                                                                                                  естественно речь идёт об одной аббривиатуре
                                                                                                                  А несколько — неинтересно :)
                                                                                                              • НЛО прилетело и опубликовало эту надпись здесь
                                                                                                                  0
                                                                                                                  Очевидно, что вместо
                                                                                                                  <div class='wrapper'>
                                                                                                                      <div class='head'>
                                                                                                                          <div id='hello'></div>
                                                                                                                      </div>
                                                                                                                      <div class='bodydiv'></div>
                                                                                                                  </div>
                                                                                                                  

                                                                                                                  получится
                                                                                                                  <div class='wrapper'>
                                                                                                                      <div class='head'>
                                                                                                                          <div id='hello'></div>
                                                                                                                          <div class='bodydiv'></div>
                                                                                                                      </div>
                                                                                                                  </div>
                                                                                                                  
                                                                                                                  • НЛО прилетело и опубликовало эту надпись здесь
                                                                                                                      +1
                                                                                                                      Использование скобок, по-моему, — интересная возможность. Но это похоже на упрощение одного за счёт усложнения другого ,) А это вряд ли вписывается в концепцию Zen-Coding'а (к разработке не имею никакого отношения, поэтому не мне судить; да и использую не так давно — довольствовался сниппетами Expression Web'а).
                                                                                                              0
                                                                                                              table>tr*5>td*3
                                                                                                              Магия, а не кодирование )
                                                                                                              Спасибо. Жаль что NetBeans не поддерживает
                                                                                                                –1
                                                                                                                Скажите, а для дримвивера когда-нибудь допилят нормальный экстеншен? То что сейчас есть не юзабельно :(
                                                                                                                  0
                                                                                                                  Просто супер. Громадное спасибо Сергею.
                                                                                                                    0
                                                                                                                    Простите конечно, что я не про крутость метода и прочее, но всё же я спрошу это…

                                                                                                                    А что за трек играет в видео??? Очень уж он хороший!
                                                                                                                      0
                                                                                                                      Seba + Paradox — Move On
                                                                                                                        0
                                                                                                                        Откройте для себя dnb, да)
                                                                                                                        0
                                                                                                                        textarea в линуховой мозиле что-то не хочет работать
                                                                                                                          0
                                                                                                                            0
                                                                                                                            Как бы ни хотелось раскритиковать, но готов признать — идея использовать «а-ля css» селекторы для генерации html хороша со всех сторон. Тут и реально быстро можно набирать простенький html. И не забыть сами селекторы)
                                                                                                                              0
                                                                                                                              В PhpStorm поддерживается, только что для себя открыл.
                                                                                                                              Лучи добра авторам идеи.

                                                                                                                              Только полноправные пользователи могут оставлять комментарии. Войдите, пожалуйста.

                                                                                                                              Самое читаемое