Firebug-esque CSS editor

Question

Dưới đây là công việc hiện tại của tôi để chỉnh sửa CSS:

1. nhớ: "Này các cậu, hãy xem trang này"
2. Guys: "Cố gắng làm cho tiêu đề bài viết lớn hơn"
3. Nhấp chuột phải vào một tiêu đề bài, chọn "kiểm tra" (để kiểm tra nó trong firebug)
4. Tìm tuyên bố CSS thích hợp trong Firebug (h2.post_title hoặc một cái gì đó)
5. sửa đổi CSS trong Firebug, hỏi bạn bè như thế nào nó trông
6. Nếu nó có vẻ tốt, thực hiện thay đổi một lần nữa trong Textmate

tôi muốn tránh bước 6. Tức là, tôi muốn khả năng chỉnh sửa CSS qua một giao diện người dùng giống Firebug và có thể o cam kết thay đổi của tôi đến tập tin có liên quan ngay lập tức (thay vì phải sao chép chúng bằng tay như tôi làm với Firebug)

Edit: Cái gì đó hoạt động trên một máy Mac sẽ là lý tưởng

Answer 1

Các bạn đã thử "Web Developer" mở rộng trong Firefox? Nó cho phép bạn mở, chỉnh sửa và lưu các tập tin CSS.

Answer 2

Một công việc có thể:

1. "Hey guys, hãy xem trang này!"
2. "Thử làm cho tiêu đề bài viết lớn hơn"
3. Hãy thay đổi vào file CSS
4. Hit tải lại

tôi chỉ sử dụng Firebug để gỡ lỗi (ví dụ như: "tại sao điều này nhận được phong cách đó? ") không phải để thực hiện thay đổi khi tôi biết nơi họ cần phải đi trong CSS. Luồng công việc này phụ thuộc phần nào vào việc có thể tải lại CSS một cách dễ dàng. Nếu bạn đang làm việc trên một ứng dụng mà nhấn tải lại hoàn toàn phá vỡ trạng thái của bạn nó có thể không phải là lý tưởng.

Answer 3

http://www.skybound.ca/

Go ra và được giác ngộ. Đây thực sự là một chương trình thay đổi cuộc sống.

Answer 4

XRefresh với "Soft Refresh" kích hoạt có thể giúp công việc của bạn, nhưng bạn vẫn cần phải biết những gì selectors CSS nào bạn muốn thêm/chỉnh sửa.

Answer 5

Check-out Backfire:

http://blog.quplo.com/2010/08/backfire-save-css-changes-made-in-firebug/

đã không thử nó, nhưng có vẻ đầy hứa hẹn.

Answer 6

Backfire (xem bài dưới đây) đã được tạo ra đặc biệt cho Quplo (http://quplo.com), đó là một công cụ mà specificly làm những gì bạn mô tả. Bạn viết html và css, sau đó nói về những gì cần phải được thay đổi, thực hiện các thay đổi (sử dụng firebug hoặc thanh công cụ phát triển web) và nhấn lưu.

Answer 7

Check-out đóng góp của tôi cho vấn đề này: http://www.cssupdater.com

Bước 6 sau đó sẽ là: 6: Một nhấp chuột vào nút "Sync bây giờ" trong Firebug !!

Nhấp chuột gửi các thay đổi của bạn tới ứng dụng dành cho máy tính để bàn, đồng bộ hóa các tệp css gốc của bạn. Bạn cũng có thể chọn các thay đổi bạn muốn đồng bộ trong ứng dụng. Nó hoạt động với trình soạn thảo văn bản yêu thích của bạn hoặc IDE và trên cả Windows và Mac!

Heureka?

Answer 8

Lý do tại sao tôi đang phát triển LIVEditor, bởi vì tôi không muốn thực hiện lại thay đổi theo cách thủ công trong trình chỉnh sửa văn bản sau khi tinh chỉnh các kiểu css của tôi trong Firebug (hoặc thích).