html - 如何在 ATOM 编辑器中制作 css 媒体查询片段

标签 html css atom-editor

在休息了大约一年后,我刚刚开始再次探索 ATOM,现在的错误少了很多,我只是在探索制作片段部分,我只是在经历 THIS 文档,

现在很多关于如何制作 css 片段的内容,当然我尝试了与 JS 片段相同的语法,并在我的片段文件中有一个 css 片段,如下所示:

'.source.css':
   'css-media':
     'prefix': 'css-media'
     'body': '@media (min-width:$1) {
          $2
      }'

问题是上面给了我以下输出:

@media (min-width:) {  }

然后:

@media (min-width:) { 

}

现在我确实在线浏览了一些 css 包,例如 THIS ONE ,但没有找到在 ATOM 中制作媒体查询片段的示例。有人可以告诉我我怎样才能做到这一点?

最佳答案

请参阅您链接的页面底部:http://flight-manual.atom.io/using-atom/sections/snippets/

You can also use multi-line syntax using """ for larger templates

所以你的模板应该是

'.source.css':
   'css-media':
     'prefix': 'css-media'
     'body': """@media (min-width:$1) {
          $2
      }"""

关于html - 如何在 ATOM 编辑器中制作 css 媒体查询片段,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/37501472/

相关文章:

git - 如何将多个 git 存储库分组到一个存储库中

javascript - LimeJS goog.event.listen 不会对子进程触发

html - 如何将垂直文本导航栏粘贴到右边而没有间隙?

html - CSS 2 位置 :Fixed Elements weird behaviour

javascript - 在悬停时在动态生成的类中添加事件

c++ - 生成 C++ 在 Atom 中包含 header 保护?

sql - 正则表达式仅用双引号替换第一个分号

javascript - FooTable 的分页 : a jQuery Plugin for Responsive Data Tables

html - Chrome 正在垂直拉伸(stretch)我的图像,但是在 Firefox/Edge 中一切正常

html - 垂直居中菜单偏移