For front-end engineers, the basic structure of writing an HTML page is manual work, and every time you copy a problem, sublime text 2 provides a good code snippet for reuse. The procedure for creating a HTML5 code fragment is described below.
Click Tools---New Snippet on the menu to create a new XML File tab:
1 <snippet>
2 <content><![CDATA[
3 Hello, ${1:this} is a ${2:snippet}.
4 ]]></content>
5 <!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
6 <!-- <tabTrigger>hello</tabTrigger> -->
7 <!-- Optional: Set a scope to limit where the snippet will trigger -->
8 <!-- <scope>source.python</scope> -->
9 </snippet>
The comments have been described in more detail.
Content inside is the code template: ${Sequence Number: The default value}, the same number of places the cursor will be stopped at the same time can be edited in many places. The ordinal size is tabindex. When you actually use the code, you can use tab to toggle the cursor position.
Tabtrigger is when you enter the string and the tab is the content of the cursor that is inserted in content.
Scope refers to which file types are used.
Here is the definition of the HTML5 code fragment:
<snippet>
<content><![CDATA[
<!doctype html>
<html>
<head>
<meta charset="utf-8">
<title>${1}</title>
</head>
<body>
<h1>${1}</h1>
Hello, ${2:this} is a ${3:snippet}.
</body>
</html>
]]></content>
<!-- Optional: Set a tabTrigger to define how to trigger the snippet -->
<tabTrigger>html5</tabTrigger>
<!-- Optional: Set a scope to limit where the snippet will trigger -->
<!-- <scope>source.python</scope> -->
</snippet>
Save the default save path as c:\users\[user]\appdata\roaming\sublime Text 2\packages\user\html5.sublime-snippet (Win7) after editing is done. The suffix must be. Sublime-snippet.
After you save the restart Sublime Text 2, create a new file: Enter Html5,tab The following effect appears:
${1} appears two times, so the cursor edits two of the graphs simultaneously.
${2:this}, the This default value appears at 2. ${1} at the end of the Edit press TAB to ${2}.
OK, that's all.
Sublime Text 2 Learning (i): Creating Reusable Code Snippets
Start building with 50+ products and up to 12 months usage for Elastic Compute Service
1 on 1 presale consultation
24/7 Technical Support 6 Free Tickets per Quarter Faster Response
Alibaba Cloud offers highly flexible support services tailored to meet your exact needs.
A comprehensive suite of global cloud computing services to power your business
Payment Methods We Support
