• idea編寫HTML程式碼常用快捷鍵 2021-05-15 20:05:47

  IntelliJ-Idea開發工具來編寫HTML程式碼時常用的快捷鍵 輸入然後+Tab鍵

  windows使用者將command換成ctrl

    1、link:css      引入css檔案      <link rel="stylesheet" href="">
    2、script:src    引入js檔案       <script src=""></script>
    3、ul+            ul以及一個li
    4、script         html中插入js
    5、a:link         <a href=”http://”></a>
    6、html:5         h5結構
    7、div.class1     class:class1    <div class="class1"></div>
    8、div#id1        id:id1          <div id="id1"></div>
    9、div.class1.class2   class:class1,class2    <div class="class1 class2"></div>
    10、a.mail          <a href=''mailto:''></a>
    11、form:get        get表單
    12、input:hidden    hidden輸入框
    13、head>link:css   head+link
    14、p+P             兩個p
    15、p*3             3個p
    16、ul>li.item$*5    建立ul下有個li同時class分別為item1，item2...5個
    17、pos             position，組合可用pos:s|a|r|f
    18、t               top，組合a auto
    19、r               right，組合a 
    20、l               left
    21、b               bottom
    22、z               z-index
    23、fl              float
    24、cl              clear
    25、d               display 組合可用n|b|i|ib
    26、ov              overflow
    27、v               visibility
    28、zoo             zoom:1
    29、cp              clip
    30、bx              box-sizing
    31、bxsh:w          -webkit-box-shadow:0 0 0 #000;
   
  

  導包：alt+enter
  生成構造，getter，setter：control + enter
  選中多個相同的元素：control + G
  自動為每行尾部新增分號： command + shift + enter
  

 這些快捷操作需要Emmet外掛，本文是在VSCode下編寫的，其他編輯器如Atom、Sublime Text和Intellij Idea都支援Emmet，其功能還有很多，待以後慢慢學習。

• idea編寫HTML程式碼常用快捷鍵 2021-05-15 20:05:47

  IntelliJ-Idea開發工具來編寫HTML程式碼時常用的快捷鍵 輸入然後+Tab鍵

  windows使用者將command換成ctrl

    1、link:css      引入css檔案      <link rel="stylesheet" href="">
    2、script:src    引入js檔案       <script src=""></script>
    3、ul+            ul以及一個li
    4、script         html中插入js
    5、a:link         <a href=”http://”></a>
    6、html:5         h5結構
    7、div.class1     class:class1    <div class="class1"></div>
    8、div#id1        id:id1          <div id="id1"></div>
    9、div.class1.class2   class:class1,class2    <div class="class1 class2"></div>
    10、a.mail          <a href=''mailto:''></a>
    11、form:get        get表單
    12、input:hidden    hidden輸入框
    13、head>link:css   head+link
    14、p+P             兩個p
    15、p*3             3個p
    16、ul>li.item$*5    建立ul下有個li同時class分別為item1，item2...5個
    17、pos             position，組合可用pos:s|a|r|f
    18、t               top，組合a auto
    19、r               right，組合a 
    20、l               left
    21、b               bottom
    22、z               z-index
    23、fl              float
    24、cl              clear
    25、d               display 組合可用n|b|i|ib
    26、ov              overflow
    27、v               visibility
    28、zoo             zoom:1
    29、cp              clip
    30、bx              box-sizing
    31、bxsh:w          -webkit-box-shadow:0 0 0 #000;
  

  導包：alt+enter
  生成構造，getter，setter：control + enter
  選中多個相同的元素：control + G
  自動為每行尾部新增分號： command + shift + enter