Có một trang web ngoài đó có một loạt các HTML điển hình để xem CSS trông như thế nào khi được áp dụng không?
Ý tôi là, một cái gì đó đầy table
, a
, div
, span
, p
, bất cứ điều gì. Bạn đến đó, dán CSS của bạn và xem kết quả.
Có một trang web ngoài đó có một loạt các HTML điển hình để xem CSS trông như thế nào khi được áp dụng không?
Ý tôi là, một cái gì đó đầy table
, a
, div
, span
, p
, bất cứ điều gì. Bạn đến đó, dán CSS của bạn và xem kết quả.
Câu trả lời:
Wow, ai đó vừa đăng cái này lên SO.
Nó chỉ là những gì bác sĩ đã ra lệnh: http://jsfiddle.net/
Bạn có thể viết html, css và javascript và chạy thẳng đến đó !! Thêm vào đó họ đã có tài liệu tham khảo về Jquery và những thứ khác!
Tôi nghĩ rằng Quy tắc Internet 33 là nếu bạn muốn / tưởng tượng ra nó, nó ở ngoài kia! ;)
Tôi chỉ tình cờ tìm thấy http://colorschemedesigner.com/ .
Thật tuyệt khi chọn màu sắc và sẽ hiển thị cho bạn các trang mẫu để xem cách phối màu sẽ được áp dụng cho một trang thông thường.
Cập nhật: trang web hiện là http://paletton.com
Tôi không biết về bất kỳ điều gì, nhưng điều này là đơn giản để thiết lập chính mình. Chỉ cần tạo một tài liệu HTML cơ bản với tất cả các yếu tố bạn mô tả. (Bạn có thể tạo văn bản nếu cần thiết từ Lipsum.com .) Sau đó liên kết với tệp CSS trong phần đầu tài liệu để xem các kiểu của bạn được đính kèm. Lần tới khi bạn muốn kiểm tra, hãy thay đổi nó để trỏ đến một tệp CSS khác.
Không chính xác những gì bạn yêu cầu, nhưng tôi yêu các chế độ theo dõi trực tiếp các less.js .
Nói chung, tôi chỉ giả lập bất kỳ yếu tố / kết hợp nào trong bất kỳ hương vị nào của HTML hoặc XHTML là bắt buộc theo cách thủ công, nhưng bạn có thể tạo tài liệu chính của các yếu tố. Nếu bạn cắm vào màn hình thứ hai (hoặc hai, ba, v.v.) để mở tất cả các trình duyệt trên (hoặc sử dụng máy tính thứ hai), mọi thay đổi bạn lưu sẽ được áp dụng trực tiếp cho tất cả các trình duyệt đó cùng một lúc.
Cú pháp LessCSS có thể được sử dụng cùng với CSS thông thường nhưng hoạt động nhanh hơn và dễ lấy hơn (kết quả có thể được chuyển đổi thành CSS bình thường sau đó).
Các công cụ như Aviary cho phép bạn dễ dàng chụp ảnh màn hình (bao gồm tự động cuộn xuống và khâu), có thể được chú thích nhanh chóng (trực tuyến với các liên kết có thể chia sẻ) hoặc được lưu và so sánh trong một công cụ khác (như Photoshop , GIMP , Paint .NET , v.v.) bằng cách phủ chúng thành các lớp và thay đổi độ trong suốt của lớp trên cùng.
Biên tập:
Nếu bạn muốn tự động hóa quy trình chụp màn hình (lưu tệp) để:
sau đó bạn có thể sử dụng một cái gì đó như trình xem tệp (xin vui lòng loại trừ hướng Python, có rất nhiều giải pháp khác) với trình lấy màn hình . Xử lý bài cũng có thể được tự động hóa và nếu bạn sử dụng các vị trí cửa sổ nhất quán (môi trường chương trình / máy tính để bàn có thể hỗ trợ điều này), "chrome" xung quanh các trình duyệt có thể được cắt ra như một phần của tập lệnh.
w3schools cho phép bạn chơi xung quanh với các quy tắc HTML và CSS. Chỉ cần tìm CSS / HTML mà bạn muốn chơi và tìm nơi nó nói, "Hãy tự mình thử". Đây là border CSS
trang của họ và đây là sân chơi của họ .
Tôi xây dựng tất cả các trang của mình bằng html / css sau đó sử dụng các công cụ quản trị trang web firebird hoặc chrome để thêm / thay đổi / thử nghiệm với các kiểu. Đó là nhanh chóng, đơn giản và tạm thời, rất tốt cho thử nghiệm. Ngoài ra, bạn có thể làm việc với mã của riêng bạn trên các máy chủ của riêng bạn, đây là một phần thưởng khác.
Buzzkill: phần Nhà phát triển giao diện người dùng của tôi cảnh báo bạn rằng tốt hơn là nên khái niệm trong một công cụ thiết kế thực sự và sau đó viết mã để bắt chước do sự khác biệt trong trình duyệt .... chỉ cần nói ...
Lưu ý bên lề - Tôi là một fan hâm mộ lớn của UI Themeroller của Jquery. Một công cụ như vậy không tồn tại để Themeroller thay đổi phong cách ở bên cạnh. Bạn hoàn toàn có thể tạo chủ đề cho một trang web thông qua CSS của Themeroller, sau đó chỉ cần chuyển đổi giữa các chủ đề khác nhau. Nếu bạn chưa từng thử nó, nó thực sự có thể tăng tốc độ triển khai, đặc biệt là nếu bạn đang tìm kiếm cái nhìn "bóng bẩy" đó rất phổ biến ngay bây giờ.
Bạn đến đó, dán vào css của bạn và xem kết quả.
Ở đây bạn đi: http://www.oswt.co.uk/developments/style_sheet_viewer/
Chính xác những gì cần thiết trong câu hỏi!
Không chắc đó có phải là những gì bạn yêu cầu không, nhưng CSS Zen Garden có một trang HTML như vậy với vô số thiết kế CSS. Bạn có thể viết CSS của riêng bạn cho trang web này, các ví dụ rất truyền cảm.