construct2表单组件添加样式

construct2里面的表单组件都可以通过css样式来改变其外观。



添加一个按钮


此时预览



方法一、通过“Set CSS style”来改变


但是每次只能改变一个属性,效率非常低。



完整代码



预览



方法二、通过ID,在导出后实现。

新建css文件

@charset "utf-8";
/* CSS Document */
#btn-show {
  background: #c1e0f5;
  background-image: -webkit-linear-gradient(top, #c1e0f5, #3ba8eb);
  background-image: -moz-linear-gradient(top, #c1e0f5, #3ba8eb);
  background-image: -ms-linear-gradient(top, #c1e0f5, #3ba8eb);
  background-image: -o-linear-gradient(top, #c1e0f5, #3ba8eb);
  background-image: linear-gradient(to bottom, #c1e0f5, #3ba8eb);
  -webkit-border-radius: 28;
  -moz-border-radius: 28;
  border-radius: 28px;
  text-shadow: 3px 3px 4px #666666;
  font-family: Arial;
  color: #000000;
  font-size: 20px;
  padding: 20px 40px 20px 40px;
  border: solid #1f628d 2px;
  text-decoration: none;
}

设置按钮的ID和css文件中的ID一致


导入css文件到项目



打包导出项目



找到导出的项目,用编辑器打开index.html文件



添加css样式文件的引用



预览,这时按钮就变成css中定义的样子了。



方法三、通过set web font 导入css文件设置样式

这个方法,基本思路和方法二一样,通过设置ID来改变样式



不同的是,不需要在导出之后来手动导入css

在第一个layout里面,添加一个text对象,设置为不可见。



用Set web font来设置引用的css文件的位置。



这样,css文件就被添加到引用中了。而且,只要在一个layout中引用,就可以在整个项目中起作用。


©️2020 CSDN 皮肤主题: 深蓝海洋 设计师:CSDN官方博客 返回首页