html - 如何将设计从 Adob​​e XD 转移到 Bootstrap

标签 html twitter-bootstrap user-interface adobe

我在 Adob​​e XD 中创建了 webapp 设计。

现在我想使用 Bootstrap 框架和 HTML 在 Webstorm 中创建该设计。

是否有工具可以识别 .xd 文件中的项目?

或者至少我可以在 GUI 中创建项目,它将我的项目转换为 HTML(例如,带有文本的蓝色方形按钮,当鼠标箭头在其上时会改变不透明度)?

最佳答案

一些工具可以更轻松地将设计转换为代码,但您(可能)不会绕过编写代码来获得一个好的网站。

首先,没有真正的方法可以直接将原型(prototype)“转换”为网站。现在有一些插件可以让这样的事情变得更容易(例如“Lightning Storm CC”),但老实说,这并不能让你自己编写代码。

此外,使用 Bootstrap 实现自定义设计可能具有挑战性(或者您是否使用了 Adob​​e XD 的 Bootstrap UI 工具包?),因为 Bootstrap 本身使得实现自定义设计非常棘手。

总而言之,我认为您正在寻找的解决方案不存在。一些工具使它更舒适,但在实现自定义设计时您将无法绕过编写代码。我认为事实是有两种选择:实现自定义设计(使用代码!)或不关心设计方面并使用框架 X(此处为 Bootstrap)。

关于html - 如何将设计从 Adob​​e XD 转移到 Bootstrap,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/51790007/

相关文章:

css - 使用 CSS(或 Bootstrap)的水平时间轴

android - 如何在 Android 应用程序 UI 上获取带阴影的框?

ios - ios 上的自定义控件(条目中的示例)

初学者的 JavaScript

javascript - 您如何使用 <input type ="button"> 使用 javascript 提交表单

html - 自动在新窗口中打开每个外部链接(html、css)

jquery - 知道什么溢出:hidden has hidden

javascript - ngClass 不更新类

css - 将复选框与标签对齐

javascript - React,为什么要用 Redux