更新图片尺寸

Many web-developers forget to write width and height attributes for <img> tags which leads to poor UX. This action helps you to automate this process: simply place caret inside <img> tag and run this action to add/update width and height attributes.

许多开发者忘记给 <img> 标签添加 widthheight 属性,这样对用户体验不好。这个功能自动帮你搞定:将插入符放在 <img> 标签内,然后调用此功能,就可以添加或更新 width 与 height 属性。

In CSS, place caret inside property value with url() function to add/update width and height properties for current rule.

对于 CSS,将插入符放在属性值 url() 内,然后调用此功能,就可以添加或更新 width 与 height 属性。

  1. <textarea class="movie-def">
  2. |&lt;img src="demo.jpg" alt="" /&gt;
  3. &lt;style&gt;
  4. .block {
  5. background: url(demo.jpg);
  6. }
  7. &lt;/style&gt;
  8. ~~~
  9. tooltip: Put caret inside &lt;img&gt; tag and run “Update Image Size” to get its size
  10. moveTo: 6
  11. wait: 1000
  12. run: emmet.update_image_size ::: “Update Image Size” (Shift-Cmd-U)
  13. wait: 1000
  14. tooltip: Put caret inside value with image URL to update width and height properties of the rule
  15. moveTo: 3:22
  16. wait: 1000
  17. run: emmet.update_image_size
  18. </textarea>

Note that this action also works for absolute URLs: it will start searching for requested file from host file’s folder and then will traverse up the tree.

注意此功能对绝对 URL 路径也适用:从宿主文件所在目录开始查找文件,然后沿着目录结构向上查找。