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

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

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

01

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

02

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

03

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

04

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

05

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

06

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

相关推荐
长流小哥1 小时前
可视化开发:用Qt实现Excel级动态柱状图
开发语言·c++·qt·ui
cwtlw8 小时前
PhotoShop学习03
笔记·学习·photoshop
Invisible_He21 小时前
iOS自定义collection view的page size(width/height)分页效果
ui·ios·swift·collection
结构化知识课堂1 天前
Axure疑难杂症:完美解决文本框读取、赋值、计数(玩转文本框)
axure·验证码·计数器·文本框·文本框赋值·文本框读取·文本框监控
草巾冒小子1 天前
element-ui图片查看器
前端·vue.js·ui
大树前端老司机1 天前
UI设计中的动画效果:如何让页面更生动?
ui
烧仙草奶茶2 天前
【cocos creator 3.x】3Dui创建,模型遮挡ui效果
ui·3d·cocos creator·cocos3d
wkm9562 天前
Unity程序嵌入Qt后点击UI按钮Button没有反应
qt·ui·unity
结构化知识课堂2 天前
Axure项目实战:智慧运输平台后台管理端-母版、登录(文本框高级交互)
axure·母版设计·注册登录·垂直菜单·文本框高级交互
招风的黑耳2 天前
ElementUI元件库——提升Axure原型设计效率与质量
前端·elementui·axure