ProtoTool (CSS auto refresh, design overlay) Chrome 插件, crx 扩展下载
扩展ID: kobijmefblkndpicohiondpdnpojebjd
Front-end development tool. Auto css file refresh without page reloading, dedicated pixel perfect mode with mock-up overlay.Tired from refreshing your css? Project loading takes more, than changing css? Using SASS and want to reload file without real refresh? ProtoTool to the rescue! 1. Auto reloads your CSS/SCSS files 2. Create pixel perfect layouts with "Pixel perfect mode" 3. Media query view 4. Grid line toggling (under development) 5. Difference mode IMPORTANT notes: 1. By default plugin works on every page, then dev tools are turned on and docked to the RIGHT of the screen. If developer tools are docked to bottom - css will re-render only after mouseenter. 2. RECOMMENDED way to reload your css is: a) go to chrome extensions, choose ProtoTool extension options: http://prntscr.com/4tnwz4 b) You will see dialog, where you have to enter your domain string. Let's say you have http://localhost.com, so you will have to enter localhost.com ONLY. Press Save options and thats it! http://prntscr.com/4tny5m . Remove options will remove WHOLE list of domains. In future versions, extension will have option to remove items by one. 3. PIXEL PERFECT MODE. This is example of what you will achieve with this mode: http://prntscr.com/4tobkq (image is pushed to see difference) a) copy website screenshot to your specific project directory (let's say you have website design saved in file "1.png", placed in "/mockups" folder relatively to project). Press SHIFT + 1, you will see control panel: http://prntscr.com/4to1ci b) URL in prototype is relative URL in project, where you want to add your mockup overlay. "File path" is an mockup url, which will overlay your website. Let say, you have "http://proto.test/contact-us.html" and you want to overlay with image "http://proto.test/mockups/1.png", so your "URL in prototype" will be "/contact-us.html" (it's case sensitive) and "File path" will be "/mockups/1.png", then press "Assign URL with file". Refresh and press SHIFT + 1, wou will see overlay attached to your page. You can drag your image with mouse. Press "-" or "+" if you want to increase or decrease opacity while holding SHIFT button. SHIFT + 2 will enter difference mode. If you have any feedback or questions - please email me: Email: [email protected] LinkedIn profile: https://www.linkedin.com/pub/vaclovas-vi%C4%8Dius/23/83b/822
名称 | ProtoTool (CSS auto refresh, design overlay) |
插件标识 | kobijmefblkndpicohiondpdnpojebjd |
平台 | Chrome |
评分 | 4.21 |
评分人数 | 19 |
插件主页 | |
作者 | vaclovas.vicius |
版本号 | 0.21 |
大小 | 117 KB |
官网下载次数 | 1190 |
下载地址 | |
更新时间 | 2014-10-13 00:00:00 |
CRX扩展文件安装方法
打开Chrome浏览器的扩展程序: 地址栏直接输入:chrome://extensions/ 即可进入,将右上角的【开发者模式】开启,重启chrome(重要操作),再次打开扩展程序管理界面,把下载的crx直接拖动进去即可完成安装,注意请更新最新版本的chrome.
打开Chrome浏览器的扩展程序: 地址栏直接输入:chrome://extensions/ 即可进入,将右上角的【开发者模式】开启,重启chrome(重要操作),再次打开扩展程序管理界面,把下载的crx直接拖动进去即可完成安装,注意请更新最新版本的chrome.
回复
强烈推荐
相关推荐
大家在找这些插件
- 黑暗模式-护眼
- 蓉城
- 税号
- Pornhub 视频免费下载器 Chrome 插件_DESKTOP
- 黑暗模式-夜眼
- hare
- ai渲染
- 超市投标书
- luccascovo.com
- commercialera.com
- wechatneedweb
- 多线程下载管理插件
- 多线程下载插件
- asciidoctor.js
- 标签页冻结
- uipx-chrome-plugin-master
- Koala Inspector
- palinsestotv.com
- magyargifts.com
- 秘密阅读助手
- 媒体流
- docs online viewer
- NTKO WEB chrome
- kimi阅读助手
- ungerboeck
- bookmark preview
- easy scraper
- been choice
- css pr
- popchatgpt
- zeroomega
- openh246
- bookmark preview - productivity and extensio
- kimi网页总结助手
- ai文生视频
- canvasblocker
- fuzz
- bookmark preview - productivity and extension
- rss feed reader
- free ???vp
- right-click image saver free
- notion web clipper
- speed conctroll
- baiduexport
- transkriptor
- ttpheader
- cog system view
- ublock origin 1.54.0
- troywell
- kimi copilot
- ai文字生视频
- asciidoctor.js live preview download chrome
- link preview sidebar
- asciidoctor.js live preview
- tinamind
- 视频网页全屏
- 跳墙
- trancyt
- 文章总结
- mpi-corporation.com
- Pornhub è§é¢å è´¹ä¸è½½å¨ Chrome æ件
- 安全协议
- Kimi网页总结助手
- Kimi阅读助手
- elmo
- Easy Scraper
- mega303bet.jimdosite.com
- megapari2023com.jimdosite.com
- chart gpt
- infinity标签页
- enblecopy
- hala
- Right-click Image Saver Free
- COG SYSTEM VIEW
- COG
- dynamics power pane
- dynamics crm
- 复制文字
- 网页 复制
- Kimi Copilot
- UBlock
- vvload
- Persepolis
- 视频限制
- hostory
- clear history
- 视频编辑
- Ilink
- tg
- TinaMind
- CSS PR
- ag智能
- Elmo
- tver
- 页游
- 夜游
- oran
相关搜索词
- Auto Refresh Pro
- Super Auto Refresh
- auto refresh plus
- auto refresh
- auto refresh blocker
- super auto refresh
- auto refresh pro
- Auto Refresh
- Auto Refresh Blocker
- Auto refresh blocker
- Auto Refresh Plus
- Free-Auto-Refresh
- free-auto-refresh
- Auto Refresh Page - 自动刷新页面
- Auto Refresh Page
- Super Auto Refresh Plus
- Easy Auto Refresh
- easy auto refresh
- free auto refresh
- auto refresh page
- Auto Refresh Page - èªå¨å·æ°é¡µé¢
- AUTO REFRESH PLUS
- A Contribution to the Design of Flexible ModularChemical Plants.
- Simple Material Design Palette
- Material Design New Tab
- material design new tab
- simple material design palette
- Design
- design
- Responsive Web Design Tester