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

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

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

01

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

02

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

03

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

04

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

05

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

06

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

相关推荐
Magnetic_h6 小时前
【iOS】单例模式
笔记·学习·ui·ios·单例模式·objective-c
PM大明同学10 小时前
Axure PR 9 标签 设计&交互
交互·axure·photoshop
松门一枝花10 小时前
Axure多人协调的方式
axure
招风的黑耳21 小时前
Axure设计之表格列冻结(动态面板+中继器)
axure·中继器·冻结列·首列固定·表格列固定
北京云巴巴信息技术有限公司1 天前
TAPD卓越版的全面评测:超强的功能与用户体验优势
产品经理·需求分析
招风的黑耳2 天前
Axure设计之全屏与退出全屏交互实现
交互·axure
我码玄黄2 天前
Axure RP实战:打造高效图形旋转验证码
交互·产品经理·axure
J2虾虾2 天前
产品经理学习笔记
笔记·学习·产品经理
咔咔学姐kk3 天前
2024最新版,人大赵鑫老师《大语言模型》新书pdf分享
数据库·人工智能·语言模型·自然语言处理·pdf·知识图谱·产品经理
QD_IT伟3 天前
Ai产品经理
人工智能·产品经理