CSS Scan Pro เป็น browser extension เครื่องมือของ Devtools web design สำหรับการออกแบบเว็บไซต์ การตรวจสอบ CSS ที่แม่นยำ และรวดเร็ว เราได้ใช้เวลาสองปีในการทดสอบและสร้างเครื่องมือตรวจสอบ CSS ที่ชาญฉลาดและสมบูรณ์แบบที่สุด เพื่อให้คุณได้ทุกสิ่งที่ต้องการได้อย่างง่ายดาย และมันก็ดีขึ้นเสมอ
ทำให้ง่ายต่อการดูเว็บไซต์ ชี้เมาส์เหนือองค์ประกอบใดก็ได้ จะแสดงโค้ดที่คุณต้องการ (styles, animations, assets, ฯลฯ…) ทันที คัดลอกโค้ดด้วยการคลิกเพียงครั้งเดียว หรือแก้ไขด้วยโปรแกรมแก้ไข CSS ที่ใช้งานง่าย โดยไม่ต้องเขียนโค้ด เราสามารถนำโค้ดไปวางและใช้กับงานเราได้เลย
รีวิวที่ดีนั้นควรมีราคา
CSS Scan Pro นั้นไม่ปรากฎว่าเคยขายแบบ Lifetime แต่หน้าเว็บแสดงราคาไว้ 2 แบบดังนี้
- CSS Scan Pro $20/month : แบบรายเดือน
Billed every month - License for 3 activations
- All updates within 1 month
- Chrome, Firefox, Safari
- Scan unlimited websites
- CSS Scan Pro $10/month : แบบรายปี
Billed $120 yearly - License for 3 activations
- All updates within 1 year
- Chrome, Firefox, Safari
- Scan unlimited websites
- Priority Support
- Save 50% – Get 6 months free
CSS Scan Pro รองรับ browser
- chrome
- firefox
- safari
คุณสมบัติ
- Inspect CSS on the fly
- Uncluttered, optimized, and clean CSS: a code that is easy to understand
- Colors previews and syntax highlighting
- Identify which font is being used
- Check element dimensions
- Check HTML attributes
- Copy all pseudo-classes (:hover, :focus, etc)
- Copy all pseudo-elements (:before, :after, etc)
- Copy the CSS and HTML of the element and all its children
- Copy CSS animations @keyframes
- Copy CSS selector (classes, ids, and unique selectors)
- Export element to Codepen or save it as a file
- Check alignments in real-time with guidelines
- Re-target selected element with DOM tree navigation
- Media queries support
Live editing
ปรับแต่ง CSS ขององค์ประกอบใดๆ ได้อย่างง่ายดาย และดูการเปลี่ยนแปลงในแบบเรียลไทม์และประสบการณ์ที่ราบรื่น
Visual Editor เหมือนมี builders ตัวช่วยสร้างธีมของ WordPress แค่มันมีไว้สำหรับทุกเว็บที่เราเปิดมันสามารถส่องโค้ดของเว็บเขาได้ และจะสร้างโค้ด CSS ระดับเฟิร์สคลาสให้คุณโดยอัตโนมัติ พร้อมใช้งาน
- Visual Editor: change and add styles interactively, without writing CSS code
- Code Editor: with syntax highlighting and color pickers
- Quickly experiment design tweaks in real-time
- Edit everything, including pseudo-classes, pseudo-elements, and @keyframes!
All changes are tracked and shareable
CSS Scan Pro ติดตามการเปลี่ยนแปลงทั้งหมดที่คุณทำกับ CSS ขององค์ประกอบเมื่อใช้งาน ไม่เคยสูญเสียการเปลี่ยนแปลงของคุณอีกต่อไป ดูการปรับปรุงทั้งหมดที่คุณทำ และแชร์ คัดลอก หรือส่งออกทั้งหมดได้อย่างง่ายดาย
- Share all changes as a link that anyone can access to see the edited website with your CSS changes – even
- if they don’t have the extension installed
- Export all changes as a file (easily share it with your team)
- Reset all changes
- Copy all changes
Copy and export elements
แยก HTML และ CSS ขององค์ประกอบและลูกทั้งหมด (เป็นส่วนประกอบทั้งหมด)
คุณสามารถแบ่งปันองค์ประกอบเว็บเหล่านี้ (เป็นไฟล์หรือตัวอย่าง Codepen) กับทีมของคุณ หรือเก็บไว้บนเดสก์ท็อปของคุณ และเริ่มโฟลเดอร์ขององค์ประกอบที่สวยงามซึ่งคุณสามารถใช้ในโครงการของคุณได้ตั้งแต่วันนี้เป็นต้นไป
- Copy the CSS and HTML of elements and its children
- Save elements as files
- Export elements to Codepen