1 =begin   2 本文档是CSS代码块的编辑文件。注意不要把其他语言的设置放到css里来。  3 HBuilder可使用ruby脚本来编辑代码块和增强操作命令。  4 1、编辑代码块  5 如果要新增一个代码块，复制如下一段代码到空白行，然后设定参数。  6     ‘userselect:none‘是代码块的显示名字；  7     s.trigger = ‘usn‘ 是设定激活字符，比如输入usn会在代码提示时显示该代码块；  8     s.expansion = ‘‘ 是设定该代码块的输出字符，其中$0、$1是光标的停留和切换位置。  9 snippet "userselect:none" do |s| 10     s.trigger = "usn" 11     s.expansion = ‘-webkit-user-select: none; 12 -moz-user-select: none; 13 -ms-user-select: none;‘ 14 end 15 2、编辑按键命令 16 如果要新增一个按键操作命令，复制如下一段代码到空白行，然后设定参数。 17 ‘Br‘是命令名字； 18 s.key_binding = ‘CONTROL+ENTER‘ 是设定按什么快捷键可以触发这个命令； 19 s.expansion = ‘<br/>‘ 是设定输出字符。 20 snippet ‘Br‘ do |s| 21   s.key_binding = ‘CONTROL+ENTER‘ 22   s.expansion = ‘<br/>‘ 23 end 24 以上以html代码块做示例，css代码块类似，使用时注意避免混淆 25 操作时注意冲突，注意备份，有问题就还原。 26 多看看已经写的ruby命令，会发现更多强大技巧。 27 修改完毕，需要重启才能生效。 28 玩的愉快，别玩坏！ 29 脚本开源地址 https://github.com/dcloudio/HBuilderRubyBundle ，可以把你的配置共享到这里，也可以在这里获取其他网友的版本 30 =end 31  32 require ‘ruble‘ 33  34 with_defaults :scope => "source.css support.type.property-name.css" do 35    36 #  snippet "!important CSS" do |s| 37 #    s.trigger = "!" 38 #    s.expansion = "${1:!important}" 39 #  end 40    41   snippet "-webkit-" do |s| 42     s.trigger = "webkit" 43     s.needApplyReContentAssist = true 44     s.expansion = ‘-webkit-‘ 45   end 46    47   snippet "-moz-" do |s| 48     s.trigger = "moz" 49     s.needApplyReContentAssist = true 50     s.expansion = ‘-moz-‘ 51   end 52    53   snippet "-ms-" do |s| 54     s.trigger = "ms" 55     s.needApplyReContentAssist = true 56     s.expansion = ‘-ms-‘ 57   end 58    59   snippet "background: image repeat attachment position" do |s| 60     s.trigger = "bg" 61     s.needApplyReContentAssist = true 62     s.expansion = "background: url($1) ${2:repeat/repeat-x/repeat-y/no-repeat} ${3:scroll/fixed} ${4:top left/top center/top right/center left/center center/center right/bottom left/bottom center/bottom right/x-% y-%/x-pos y-pos};$0" 63   end 64      65   snippet "background-color" do |s| 66     s.trigger = "bc" 67     s.expansion = "background-color: $1" 68     s.needApplyReContentAssist = true 69   end 70      71   snippet "background-color: \#" do |s| 72     s.trigger = "bch" 73     s.expansion = "background-color: \#$1" 74     s.needApplyReContentAssist = true 75   end 76    77   snippet "background-color: rgb" do |s| 78     s.trigger = "bcr" 79     s.expansion = "background-color: rgb(${1:255},${2:255},${3:255})" 80   end 81    82   snippet "background-image" do |s| 83     s.trigger = "bi" 84     s.expansion = "background-image: $1" 85     s.needApplyReContentAssist = true 86   end 87    88   snippet "background-image: url" do |s| 89     s.trigger = "biu" 90     s.expansion = "background-image: url($1)" 91     s.needApplyReContentAssist = true 92   end 93    94   snippet "background-position" do |s| 95     s.trigger = "bp" 96     s.expansion = "background-position: $1" 97     s.needApplyReContentAssist = true 98   end 99 100   snippet "border-color" do |s|101     s.trigger = "boc"102     s.expansion = ‘border-color: $1‘103     s.needApplyReContentAssist = true104   end105   106   snippet "border-style" do |s|107     s.trigger = "bs"108     s.expansion = ‘border-style: $1‘109     s.needApplyReContentAssist = true110   end111   112   snippet "border-width" do |s|113     s.trigger = "bw"114     s.expansion = ‘border-width: $1‘115     s.needApplyReContentAssist = true116   end117   118   snippet "display: none" do |s|119     s.trigger = "dn"120     s.expansion = ‘display: none‘121   end122 123   snippet "overflow: hidden" do |s|124     s.trigger = "ovh"125     s.expansion = ‘overflow: hidden‘126   end127   128   snippet "display: block" do |s|129     s.trigger = "db"130     s.expansion = ‘display: block‘131   end132   133   snippet "font-family: family" do |s|134     s.trigger = "ff"135     s.expansion = ‘font-family: $1‘136     s.needApplyReContentAssist = true137   end138   139   snippet "font-size: size" do |s|140     s.trigger = "fsize"141     s.expansion = ‘font-size: $1‘142     s.needApplyReContentAssist = true143   end144 145   snippet "height length" do |s|146     s.trigger = "hei"147     s.expansion = ‘height ${1}px;$0‘148   end149   150   snippet "list-style-image: url" do |s|151     s.trigger = "lsi"152     s.expansion = ‘list-style-image: url($1);‘153     s.needApplyReContentAssist = true154   end155   156   snippet "properties { } ( } )" do |s|157     s.trigger = "{"158     s.expansion = ‘{159     /* $1 */160     $0161 ‘162   end163   # FIXME Doesn‘t work164   snippet "scrollbar" do |s|165     s.trigger = "scrollbar"166     s.expansion = ‘scrollbar-base-color:       ${1:#CCCCCC};167 scrollbar-arrow-color:      ${2:#000000};168 scrollbar-track-color:      ${3:#999999};169 scrollbar-3dlight-color:    ${4:#EEEEEE};170 scrollbar-highlight-color:  ${5:#FFFFFF};171 scrollbar-face-color:       ${6:#CCCCCC};172 scrollbar-shadow-color:     ${7:#999999};173 scrollbar-darkshadow-color: ${8:#666666};‘174   end175   176   snippet "text-align: left" do |s|177     s.trigger = "tal"178     s.expansion = ‘text-align: left;‘179   end180 181   snippet "text-align: center" do |s|182     s.trigger = "tac"183     s.expansion = ‘text-align: center;‘184   end185 186   snippet "text-align: right" do |s|187     s.trigger = "tar"188     s.expansion = ‘text-align: right;‘189   end190   191   snippet "text-transform" do |s|192     s.trigger = "tt"193     s.expansion = ‘text-transform: $1‘194     s.needApplyReContentAssist = true195   end196   197   snippet "width length" do |s|198     s.trigger = "wid"199     s.expansion = ‘width: ${1}px;$0‘200   end201   202   snippet "margin-top" do |s|203     s.trigger = "mgt"204     s.expansion = ‘margin-top: $1‘205   end206   207   snippet "userselect:none" do |s|208     s.trigger = "usn"209     s.expansion = ‘-webkit-user-select: none;210 -moz-user-select: none;211 -ms-user-select: none;‘212   end213 end214 215 with_defaults :scope => "source.css entity.name.tag.css" do216   snippet "@font-face" do |s|217     s.trigger = "@fontface"218     s.locationType="CSS_OUTRULE"219     s.expansion = ‘@font-face {220     font-family:$1;221     src: url($2);222 }‘223   end224   225   snippet "@import" do |s|226     s.trigger = "@import"227     s.locationType="CSS_OUTRULE"228     s.expansion = ‘@import url("${1:global.css}");‘229   end230   231   snippet "@charset" do |s|232     s.trigger = "@charset"233     s.locationType="CSS_OUTRULE"234     s.expansion = ‘@charset "${1:utf-8}";‘235   end236   237   snippet "@page" do |s|238     s.trigger = "@page"239     s.locationType="CSS_OUTRULE"240     s.expansion = ‘@page:${1:first/left/right}{241     242 }‘243   end244   snippet "@keyframes" do |s|245     s.trigger = "@keyframes"246     s.locationType="CSS_OUTRULE"247     s.expansion = ‘@keyframes ${1:name}{248     from{$2}249     to{$3}250 }‘251   end252   253   snippet "@-moz-keyframes" do |s|254     s.trigger = "@keyframes"255     s.locationType="CSS_OUTRULE"256     s.expansion = ‘@-moz-keyframes ${1:name}{257     from{$2}258     to{$3}259 }‘260   end261   262   snippet "@-ms-keyframes" do |s|263     s.trigger = "@keyframes"264     s.locationType="CSS_OUTRULE"265     s.expansion = ‘@-ms-keyframes ${1:name}{266     from{$2}267     to{$3}268 }‘269   end270   271   snippet "@-webkit-keyframes" do |s|272     s.trigger = "@keyframes"273     s.locationType="CSS_OUTRULE"274     s.expansion = ‘@-webkit-keyframes ${1:name}{275     from{$2}276     to{$3}277 }‘278   end279   280   snippet "@document" do |s|281     s.trigger = "@document"282     s.locationType="CSS_OUTRULE"283     s.expansion = ‘@document ${1:url/url-prefix/domain/regexp}("$2") {284     $3285 }‘286   end287   288   snippet "@supports" do |s|289     s.trigger = "@supports"290     s.locationType="CSS_OUTRULE"291     s.expansion = ‘@supports(${1:prop}:${2:value}) {292     $3293 }‘294   end295   296   snippet "@namespace" do |s|297     s.trigger = "@namespace"298     s.locationType="CSS_OUTRULE"299     s.expansion = ‘@namespace ${1:prefix} "$2";‘300   end301   302     303   snippet "@media" do |s|304     s.trigger = "@media"305     s.locationType="CSS_OUTRULE"306     s.expansion = ‘@media only screen and (min-width: $1px) {307     $2308 }‘309   end310 end