Axure 教程 | 设置文本框背景透明

​在AXURE软件中,部件样式可以编辑,但有时却无法满足所有个性化原型的需求。例如文本框部件,可以设置是否隐藏边框,但即使隐藏边框之后,文本框还会有白色的背景。

当界面需要一个无背景色的输入框时,对于完美主义者来说,那无法去除的白色背景就显得尤其无法忍受,现在,就让我们用非常规手段,去了它。

01

建立"文本框背景透明"页面,双击页面名称,打开页面编辑页

02

"部件"窗口,拖一个矩形到编辑页,设置填充颜色:蓝色;再拖一个文本框(单行)放置在矩形的上面。

03

生成原型(注意是生成,不是预览),可以看到文本框(单行)的白色背景遮住了下面的矩形一部分。

04

找到原型生成时,保存的文件地址,找到"文本框背景透明"页面的样式文件:styles.css

05

打开styles.css文件,找到文本框(单行)部件的CSS样式,在样式内增加:opacity:0

06

保存styles.css文件,在浏览器中刷新原型查看效果

相关推荐
若愚67922 小时前
前端取经路——量子UI:响应式交互新范式
前端·ui·交互
松树戈13 小时前
plus-ui&RuoYi-Vue-Plus 基于pgSql本地运行实践
前端·vue.js·spring boot·ui
Jelian_1 天前
element-ui的el-cascader增加全选按钮实现(附源码)
vue.js·ui·elementui
向宇it2 天前
【unity游戏开发——编辑器扩展】使用EditorGUI的EditorGUILayout绘制工具类在自定义编辑器窗口绘制各种UI控件
开发语言·ui·unity·c#·编辑器·游戏引擎
招风的黑耳2 天前
Axure设计之内联框架切换页面、子页面间跳转问题
axure·页面跳转·内联框架
小众AI2 天前
UI-TARS: 基于视觉语言模型的多模式代理
人工智能·ui·语言模型
花落已飘2 天前
LVGL(lv_btnmatrix矩阵按钮)
ui·c·lvgl
kooboo china.2 天前
在UI 原型设计中,交互规则有哪些核心要素?
ui·编辑器·交互
编程乐趣2 天前
推荐一个Winform开源的UI工具包
microsoft·ui·开源
森哥的歌2 天前
AI背景下,如何重构你的产品?
人工智能·ai·数字化转型·用户体验·产品设计