Выделение пакета Sublime Text 2 в теге

В ST2 выделение текста и нажатие alt + shift + w (в Windows) завершает текущий выбор в тегах <p></p>. Но есть ли способ указать, какой тег нужно обернуть? Потому что, возможно, я хочу обернуть в span или div вместо.

Ответ 1

Используя Emmet, поместите курсор в тег, который вы хотите обернуть, и нажмите ctrl + w (для MacOS) или Alt + Shift + w (для Windows), появится окно чтобы ввести тип тега, который вы хотите обернуть.

Ответ 2

Вам не нужен Emmet, по крайней мере, в Sublime Text 3 для Mac.

С или без плагина Emmet, поместите курсор где-нибудь в слове, выделите слово с помощью command d, нажмите control shift w (Menubar > Edit > Tag > Wrap Selection With Tag) и введите требуемый тип элемента поверх выделенных в данный момент сгенерированных по умолчанию тегов p.

Примечание. В MS Windows ярлык для переноса - alt shift w.

enter image description here

enter image description here

enter image description here

Ответ 3

Одиночная строка

Если вы хотите преобразовать этот

Lorem ipsum dolor sit amet.

к этому

<div>Lorem ipsum dolor sit amet.</div>  

сделайте следующее:

  • Выберите текст или нажмите CTRL + L (он выберет текущую строку)
  • Нажмите ALT + SHIFT + W
  • Введите желаемый тег (он перезапишет тэг по умолчанию)

Несколько строк

Если вы хотите преобразовать этот

Item 1
Item 2
Item 3

к этому

<li>Item 1</li>
<li>Item 2</li>
<li>Item 3</li>

сделайте следующее:

  • Выберите текст или нажмите CTRL + L несколько раз
  • Нажмите CTRL + SHIFT + L (он сделает один выбор в строке)
  • Нажмите ALT + SHIFT + W
  • Введите желаемый тег (он перезапишет тэг по умолчанию)

Вы также можете выбрать текст, используя SHIFT + MOUSE RIGHT BUTTON, и в этом случае вы можете пропустить второй шаг.

Использование Emmet

Если вы хотите преобразовать этот

Item 1
Item 2
Item 3

к этому

<nav>
  <ul class="nav">
    <li class="nav-item1"><a href="">Item 1</a></li>
    <li class="nav-item2"><a href="">Item 2</a></li>
    <li class="nav-item3"><a href="">Item 3</a></li>
  </ul>
</nav>

сделайте следующее:

Примечание для пользователей Mac:

ALT + SHIFT + W= CTRL + SHIFT + W

CTRL + SHIFT + L= CMD + SHIFT + L

Ответ 4

Создайте собственный фрагмент, например, чтобы вставить тег span. Перейдите в меню приложения: Tools > New Snippet ... и скопируйте в окно снимок ниже:

<snippet>
    <content><![CDATA[
<span style="color:#0000FF">$SELECTION$1</span>
]]></content>
    <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
    <tabTrigger>span</tabTrigger>
    <description>HTML - span - color - blue</description>
    <!-- Optional: Set a scope to limit where the snippet will trigger -->
    <scope>source.html</scope>
</snippet>

... затем сохраните фрагмент файла в файле, например. html-span--color и привяжите этот фрагмент к комбинации клавиш в Preferences > Key Bindings-User, создав новую запись ключа, например:

{ "keys": ["alt+shift+c"], "command": "insert_snippet", "args": { "name": "Packages/User/html-span--color.sublime-snippet" } }

Предполагается, что расположение фрагмента является Packages/User/.

Теперь выберите любой текст, который необходимо обернуть в тег span, и нажмите Alt + Shift + c или введите "span", нажмите Tab, курсор будет установлен в нужную позицию в пределах тег, просто введите текст.

Я успешно протестировал фрагмент и привязку ключей к Sublime Text 3 в Ubuntu Linux.

Ответ 5

Ответы хорошие. Вот где привязки клавиш для настройки:

В Предпочтение: привязки клавиш - по умолчанию:

{ 
  "keys": ["ctrl+shift+w"], "command": "insert_snippet", 
  "args": { "name": "Packages/XML/long-tag.sublime-snippet" } 
}

Если у вас есть Emmet, версия emmet

{ "keys": ["super+shift+w"], "command": "wrap_as_you_type"}

Отредактируйте их в Предпочтения: привязки клавиш - пользователь по вашему вкусу,

Ответ 6

чтобы сделать вашу жизнь легкой, пока вы находитесь в Sublime text3: напечатайте любой из них ( p, h1, div, header, footer, title...) и нажмите вкладка например, если вы хотите div Просто введите div и нажмите Tab

Ответ 7

в ST2 введите тег без скобок и нажмите Tab. Это автоматически даст вам открытый и закрытый тег

Ответ 8

Эта система вставки фрагментов очень громоздка по сравнению с механизмом, предусмотренным в Dreamweaver. В этом случае вы создаете фрагмент любого типа. Он хранится в библиотеке в ОЗУ и отображается в структуре стиля каталога. Вы объявляете, является ли фрагмент типа INSERT (в позиции курсора) или типа SPAN (диапазон выделенного текста). В первом случае вставляется весь фрагмент. Во втором случае фрагмент создается с помощью "до" части и "после" . Обычно "после" часть является только закрывающим тегом. Чтобы использовать режим INSERT HERE, вы устанавливаете курсор и дважды щелкаете по фрагменту в библиотеке и вставляете его в позицию курсора. Чтобы использовать режим SPAN SELECTED TEXT, выделите нужный текст и дважды щелкните фрагмент в библиотеке. Выбранный текст окружен фрагментами "до" и "после" фрагмента. Это очень интуитивно понятный, простой в использовании и позволяет пользователю создавать неограниченные виды фрагментов, которые могут охватывать выделенный текст. ХОТЯТ НЕКОТОРЫЙ ОЧЕНЬ УМНЫЙ ПРОГРАММА ПОЖАЛУЙСТА, СТРОИТЕ РАСШИРЕНИЕ, КАК ЭТО ДЛЯ СУБЪЕКТА 3? Примечание. Для сравнения, Bracket Highlighter - это Sublime-плагин с функцией обертывания, которая, казалось бы, имеет такую ​​функциональность, но при тщательном осмотре это слишком громоздко для использования, если вы хотите создать эффективную библиотеку фрагментов на лету. Благодаря, Питер Рости