Dễ dàng chuyển đổi Adobe XD sang HTML và CSS với sự hỗ trợ cho nhiều trang, kiểu tùy chỉnh và các yếu tố động. Bạn có thể sử dụng thiết kế XD hiện tại của mình hoặc bất kỳ Mẫu XD nào được tìm thấy trực tuyến để bắt đầu Show
TIP: Learn How to use Export Kit with XD and start to experience awesome in seconds. Bạn có thể xuất (a) một Artboard duy nhất hoặc (b) tất cả các Artboard dưới dạng các trang HTML riêng lẻ. Nếu bạn xuất một Artboard duy nhất thì bạn sẽ nhận được một tệp IMPORTANT: The contents of the text layer will be used as the value of the input element when processing the form.7 riêng lẻ cho mỗi lần xuất. Nếu bạn xuất tất cả các Artboard, bạn sẽ nhận được các tệp IMPORTANT: The contents of the text layer will be used as the value of the input element when processing the form.8 riêng lẻ với một tệp IMPORTANT: The contents of the text layer will be used as the value of the input element when processing the form.7 duy nhất để lưu vào bộ nhớ đệm dễ dàng Tìm hiểu sâu hơn về xuất khẩu HTML và CSSQuá trình xuất Adobe XD sang HTML và CSS của bạn sẽ phản ánh thiết kế tài liệu XD của bạn để duy trì mối quan hệ cha/con của các lớp, cùng với việc ánh xạ các thuộc tính XD tới phần tử HTML tương ứng Các tệp HTML và CSS được xuất ra rõ ràng, dễ đọc và sẵn sàng sử dụng ngay. Tên của các phần tử trong mã phản ánh quy ước đặt tên của tài liệu XD của bạn Phạm vi Văn bản, Phông chữ và KiểuBộ công cụ xuất khẩu hỗ trợ tuyệt vời cho các bộ kiểm lâm kiểu tùy chỉnh trong các lớp văn bản XD. Sử dụng văn bản Đoạn văn và thẻ TIP: Take care when adding layer names for Input items, the layer name will be used as the Input item name in the output. Learn more about Layer Naming Rules.0, bạn có thể hiển thị phạm vi kiểu hoàn chỉnh của mình EXAMPLE: ${p} my custom text Phạm vi kiểu cho phép bạn áp dụng nhiều kiểu phông chữ cho các từ hoặc ký tự riêng lẻ trong cùng một đoạn văn; Biểu mẫu web HTML và các yếu tố đầu vàoTạo Biểu mẫu web HTML không giới hạn với các yếu tố Đầu vào động trực tiếp từ thiết kế XD của bạn bằng cách sử dụng thẻ TIP: Take care when adding layer names for Input items, the layer name will be used as the Input item name in the output. Learn more about Layer Naming Rules.1 của chúng tôi. Biểu mẫu web cho phép người dùng cung cấp thông tin mà sau đó có thể được xử lý bởi máy khách hoặc máy chủ back-end EXAMPLE: ${form|post:email_form.php} my contact form Tất cả các biểu mẫu web đều yêu cầu các yếu tố Đầu vào để xử lý dữ liệu trên máy chủ. Bạn có thể thêm các mục nhập không giới hạn vào biểu mẫu web của mình bằng Thẻ nhập của chúng tôi IMPORTANT: The contents of the text layer will be used as the value of the input element when processing the form. TIP: Take care when adding layer names for Input items, the layer name will be used as the Input item name in the output. Learn more about Layer Naming Rules. Thẻ đầu vào hoạt động với Thẻ biểu mẫu để cung cấp hỗ trợ tùy chỉnh cho các biểu mẫu web. Thẻ đầu vào sẽ cho phép bạn xác định nhiều yếu tố đầu vào và xuất chúng trực tiếp trong trang web HTML5 của bạn
EXAMPLE: ${input:password} user_password Kiểu phần tử đầu vào CSS tùy chỉnhCác kiểu lớp CSS áp dụng trực tiếp cho bất kỳ phần tử nào bất kể loại lớp XD. Điều này giúp dễ dàng tùy chỉnh hoàn toàn đầu ra cuối cùng của tất cả các dự án để phù hợp với bất kỳ thông số kỹ thuật thiết kế nào TIP: Learn more about Class Styles and Layer Styles to create custom run-time designs. Hộp đèn bật lên CSS và JavaScriptTạo nội dung động tùy chỉnh như Cửa sổ bật lên và Hộp đèn JavaScript trực tiếp bằng cách sử dụng các lớp XD của bạn cùng với các thẻ TIP: Take care when adding layer names for Input items, the layer name will be used as the Input item name in the output. Learn more about Layer Naming Rules.2 và TIP: Take care when adding layer names for Input items, the layer name will be used as the Input item name in the output. Learn more about Layer Naming Rules.3. Bạn có thể tạo bất kỳ phần tử HTML gốc hoặc tập lệnh thời gian chạy nào trong XD TIP: Learn more about Class Tag and Code Tag to create native HTML elements. Bạn có thể tùy chỉnh thêm đầu ra của mình với bất kỳ phần tử HTML5 nào bằng cách sử dụng Thẻ lớp của chúng tôi với các thư mục của bạn. Tất cả các phần tử đều hỗ trợ các thuộc tính tùy chỉnh để bạn có thể ánh xạ chúng theo bất kỳ cách nào bạn muốn IMPORTANT: When creating empty elements (eg. <div />) with Class Tag, you must include an empty argument (eg. Bạn có thể tạo BẤT KỲ phần tử nào bao gồm iframe, canvas và đối tượng, sau đây chỉ là ví dụ. Lưu ý rằng Thẻ lớp chỉ hoạt động với Thư mục Thẻ HTML Cách sử dụng${lớp. div. }${lớp. hình ảnh. } ${lớp. nhịp. } <đầu vào> ${lớp. đầu vào. loại = "textarea"}${lớp. p. }${lớp. a. href=”//google. com” title=”googlelink”}
|