育將電腦工作室 - 線上書籍

4. Sublime text3 插件ColorPicker(調色板)不能使用快捷鍵的解決方法 next

sublime text 3
==============

1. ### 快速編寫HTML代碼：「!」+ tab、「html:5」+ tab
  
   ```
  <pre class="brush:as3;">
  
  <html lang="en">
  <head>
  	<meta charset="UTF-8">
  	<title>Document</title>
  </head>
  <body>
  	
  </body>
  </html>
  ```
2. ### 添加 class，id，標籤和屬性
 
id： p#foo => <span style="color:#FF8C00;"><p id="foo"></p></span>  
 class：.container => <span style="color:#FF8C00;"><div class="container"></div></span>  
 內容： h1{foo} => <span style="color:#FF8C00;"><h1>foo</h1></span>  
 屬性： a\[href=#\] => <span style="color:#FF8C00;"><a href="#"></a></span>

3. ### 嵌套
 
>：子元素符號，表示嵌套的元素 p>span => <p><span></span></p>  
 +：同级標籤符號 h1+h2 =>

```
<pre class="brush:as3;">
<h1></h1>
<h2></h2>
```

^：可以使該符號前的標籤提升一行 p>span^p

```
<pre class="brush:as3;">
<p><span></span></p>
<p></p>
```

4. 分組
 
(.foo>h1)+(.bar>h2)

```
<pre class="brush:as3;">
<div class="foo">
	<h1></h1>
</div>
<div class="bar">
	<h2></h2>
</div>
```

5. 隱式標籤
  
  聲明一個帶類的標籤，只需輸入div.item，就會生成<div class="item"></div>。
  
  在過去版本中，可以省略掉div，即輸入.item即可生成<div class="item"></div>。現在如果只輸入.item，則Emmet會根據父標籤進行判定。比如在<ul>中輸入.item，就會生成<li class="item"></li>。  
   下面是所有的隱式標籤名稱：  
   li：用於ul和ol中  
   tr：用於table、tbody、thead和tfoot中  
   td：用於tr中  
   option：用於select和optgroup中
6. 定義多個元素   
   要定義多個元素，可以使用\*符號。比如，ul>li\*3可以生成如下代碼： ```
  <pre class="brush:as3;">
  <ul>
  	<li></li>
  	<li></li>
  	<li></li>
  </ul>
  ```
7. 定義多個帶屬性的元素   
   如果輸入ul>li.item$\*3，將會生成如下代碼： ```
  <pre class="brush:as3;">
  <ul>
  	<li class="item1"></li>
  	<li class="item2"></li>
  	<li class="item3"></li>
  </ul>
  ```
8. CSS縮寫
 
 ```
<pre class="brush:as3;">
w10 => width: 10px;
h10 => height: 10px;
bg:#000 => background: #000;
```

9. 假字  
   lorem ```
  <pre class="brush:as3;">
  Lorem ipsum dolor sit amet, consectetur adipisicing elit, sed do eiusmod
  tempor incididunt ut labore et dolore magna aliqua. Ut enim ad minim veniam,
  quis nostrud exercitation ullamco laboris nisi ut aliquip ex ea commodo
  consequat. Duis aute irure dolor in reprehenderit in voluptate velit esse
  cillum dolore eu fugiat nulla pariatur. Excepteur sint occaecat cupidatat non
  proident, sunt in culpa qui officia deserunt mollit anim id est laborum.
  ```
10. 
 
</body></html>

Title1

Title2

Title3

Title1

Title2

Title3

MarkDown