Image Cut: Giải pháp cắt ảnh và tạo mã HTML hiệu quả

Image Cut là công cụ hỗ trợ bạn chia nhỏ hình ảnh thành nhiều phần, tự động tạo mã nguồn và sắp xếp chúng theo thứ tự logic, sau đó xuất ra ở định dạng web (HTML).

Bắt đầu dự án mới

Để khởi tạo một dự án mới, bạn hãy truy cập menu File > New project trên giao diện chính của chương trình. Một hộp thoại Open background image sẽ hiện ra, cho phép bạn chọn file ảnh cần cắt từ máy tính của mình. Sau khi chọn được ảnh, nhấn Open để tiếp tục.

Tạo đường cắt ảnh

Để tạo các đường cắt dọc, bạn nhấp vào biểu tượng tương ứng trên thanh công cụ bên trái giao diện (hoặc chọn Splitters > Vertical line creation mode từ menu). Sau đó, chỉ cần nhấp chuột lên ảnh để xác định vị trí các đường cắt. Tương tự, để tạo đường cắt ngang, bạn sử dụng biểu tượng trên thanh công cụ bên phải (hoặc chọn Splitters > Horizontal line creation mode).

Nếu bạn muốn tạo các đường cắt theo dạng lưới một cách nhanh chóng, thay vì thực hiện thủ công từng đường, hãy chọn công cụ Add Grid. Nhập số lượng đường cắt ngang vào ô Horizontal cells và số lượng đường cắt dọc vào ô Vertical cells, theo công thức: [Tổng số ô cắt] = [Số đường cắt ngang] x [Số đường cắt dọc]. Cuối cùng, nhấn OK để hoàn tất.

Chỉnh sửa và xóa đường cắt

Bạn có thể dễ dàng thay đổi vị trí của các đường cắt bằng cách nhấp vào biểu tượng di chuyển và kéo thả đường cắt đến vị trí mong muốn. Để xóa một đường cắt không cần thiết, hãy nhấp vào biểu tượng chọn, chọn đường cắt cần xóa, sau đó nhấn biểu tượng xóa từ thanh công cụ.

Xuất ảnh đã cắt

Khi đã hoàn tất việc cắt ảnh, hãy nhấn nút Split. Một hộp thoại Split image sẽ xuất hiện, hiển thị số lượng ảnh sẽ được tạo ra, tương ứng với số ô bạn đã cắt trước đó.

Tại hộp thoại này, bạn có thể tùy chỉnh:

Part file name: Đặt tên cho từng file ảnh.
Part file type: Chọn định dạng ảnh mong muốn.
Output path: Chỉ định thư mục lưu trữ ảnh.
Image subpath: Đặt tên thư mục con chứa ảnh.

Lưu ý quan trọng: Nên tránh đặt tên ảnh có dấu hoặc chứa khoảng trắng. Để phân cách các phần, hãy sử dụng dấu gạch dưới "_", để đảm bảo ảnh hiển thị chính xác.

Gán thuộc tính cho ảnh và chỉnh sửa mã HTML

Bạn có thể gán các thuộc tính cho từng ảnh bằng cách chọn tên file ảnh từ danh sách và đánh dấu vào các thuộc tính tương ứng:

(chỉ định ảnh nền)
(không hiển thị ảnh)
(tạo siêu liên kết cho ảnh)

Mặc định, chương trình sẽ tự động tạo mã HTML cho các ảnh đã cắt. Tuy nhiên, nếu bạn muốn tùy chỉnh mã này, hãy đánh dấu vào tùy chọn Edit html code. Sau đó, nhấn Save parts, chỉnh sửa nội dung mã trong hộp thoại Generated html, và nhấn Save edited để lưu lại.

Kết quả cuối cùng

Sau khi hoàn tất, chương trình sẽ tự động tạo một thư mục chứa các ảnh đã cắt, kèm theo một file HTML. Bạn chỉ cần mở file HTML này bằng trình duyệt web để xem kết quả.