web-dev-qa-db-fra.com

Sublime Text 2 selectionnant la sélection dans la balise

Dans ST2, surlignez du texte et appuyez sur alt + shift + w (sous Windows) encapsule la sélection actuelle dans <p></p> Mots clés. Mais existe-t-il un moyen de spécifier lequel balise avec laquelle emballer? Parce que peut-être je veux envelopper dans un span, ou un div à la place.

tagskeyboard-shortcutssublimetext2word-wrap
78
Lars

A l’aide d’Emmet, placez le curseur sur la balise à enrouler et appuyez sur ctrl + w (pour MacOS) ou Alt+Shift+W (pour Windows), une boîte apparaîtra pour indiquer le type de balise que vous souhaitez utiliser.

75
Lars

Vous n'avez pas besoin d'Emmet, du moins pas dans Sublime Text 3 pour Mac.

Avec ou sans le plugin Emmet, placez votre curseur quelque part dans le mot, mettez le mot en surbrillance via commandd, presse controlshiftw (Menubar > Edit > Tag > Wrap Selection With Tag), et tapez le type d'élément souhaité sur les balises p générées par défaut, actuellement mises en surbrillance.

Remarque: sous MS Windows, le raccourci pour boucler est altshiftw.

enter image description here

enter image description here

enter image description here

90
jtheletter

Une seule ligne

Si vous voulez convertir ceci

Lorem ipsum dolor sit amet.

pour ça

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

faire ceci:

  • Sélectionnez le texte ou appuyez sur CTRL + L (cela sélectionnera la ligne actuelle)
  • Presse ALT + SHIFT + W
  • Tapez la balise souhaitée (elle écrasera la balise p par défaut)

Plusieurs lignes

Si vous voulez convertir ceci

Item 1
Item 2
Item 3

pour ça

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

faire ceci:

  • Sélectionnez le texte ou appuyez sur CTRL + L plusieurs fois
  • Presse CTRL + SHIFT + L (il fera une sélection par ligne)
  • Presse ALT + SHIFT + W
  • Tapez la balise souhaitée (elle écrasera la balise p par défaut)

Vous pouvez également sélectionner le texte en utilisant SHIFT + MOUSE RIGHT BUTTON, et dans ce cas, vous pouvez ignorer la deuxième étape.

Utiliser Emmet

Si vous voulez convertir ceci

Item 1
Item 2
Item 3

pour ça

<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>

faire ceci:

  • Sélectionnez le texte
  • Presse SHIFT + CTRL + G ( wrap avec abréviation )
  • Tapez nav> ul.nav> li.nav-item $ *> a

Note pour les utilisateurs de Mac:

ALT + SHIFT + W = CTRL + SHIFT + W

CTRL + SHIFT + L = CMD + SHIFT + L

20
Gustavo

Créez un extrait de code personnalisé, par exemple, pour insérer une balise span. Allez dans le menu de l'application: Tools > New Snippet ..., et copiez dans la fenêtre l'extrait de code ci-dessous:

<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>

... puis enregistrez l’extrait dans un fichier avec, par exemple, html-span--color Nommez et associez cet extrait à une combinaison de touches dans Preferences > Key Bindings-User, créant une nouvelle entrée de clé, par exemple:

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

On suppose qu'un extrait de l'extrait est Packages/User/ répertoire.

Maintenant, sélectionnez le texte que vous devez insérer dans la balise span et appuyez sur Alt+Shift+c ou tapez 'span', appuyez sur Tab, un curseur sera placé à la position requise dans la balise, tapez simplement votre texte.

J'ai testé avec succès l'extrait de code et la liaison de clé avec Sublime Text 3 sous Ubuntu Linux.

5
Vladimir S.

Les réponses sont toutes bonnes. Voici où les raccourcis clavier sont pour la personnalisation:

Dans Préférence: raccourcis clavier - Défaut:

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

Si vous avez Emmet, la version emmet est

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

Modifiez-les dans Préférences: raccourcis clavier - Utilisateur à votre goût,

5
Phillip Chan

pour vous simplifier la vie lorsque vous êtes dans Sublime text3: saisissez n’importe lequel de ces éléments ( p, h1, div, en-tête, pied de page, titre ...) et tapez Tab par exemple si vous voulez div Il suffit de taper div et d'appuyer sur Tab

1
mwangaben

dans ST2, tapez une étiquette sans crochets et cliquez sur Tab. Il vous donnera automatiquement tag ouvert et fermé

0
user4918206