vaadin css,CSS标签样式Vaadin
您可以在自己的主题中覆盖Vaadin样式。如果您还没有主题,请在名为themes的VAADIN目录下创建一个目录,然后根据主题名称在主题中创建一个子目录,例如。 mytheme的。
Vaadin 6:
呼叫setTheme("mytheme")在你的应用程序类
呼叫myTextField.setStyleName("labelstyle");在你的代码
在新的主题目录中创建styles.css的。
添加Styles.css中的以下内容:
styles.css的:
@import "../reindeer/styles.css";
.v-textfield-labelstyle {
background: none repeat scroll 0 0 #F5F5F5;
border-color: #F5F5F5;
border-image: none;
border-left: 1px solid #F5F5F5;
border-radius: 3px 3px 3px 3px;
border-right: 1px solid #F5F5F5;
border-style: solid;
border-width: 1px;
}
Vaadin 7:
添加@Theme("mytheme")标注在UI类
在您的代码中拨打myTextField.setStyleName("labelstyle");
创建样式。 scss在您的新主题目录中。
以样式添加以下内容。 SCSS
styles.css的:
@import "../reindeer/reindeer.scss";
.mytheme {
@include reindeer;
.v-textfield-labelstyle {
background: none repeat scroll 0 0 #F5F5F5;
border-color: #F5F5F5;
border-image: none;
border-left: 1px solid #F5F5F5;
border-radius: 3px 3px 3px 3px;
border-right: 1px solid #F5F5F5;
border-style: solid;
border-width: 1px;
}
}
在主题目录调用java -cp '../../../WEB-INF/lib/*' com.vaadin.sass.SassCompiler styles.scss styles.css编译你的主题
这种小伎俩会给你一个标签般的文本字段当聚焦时它变成正常的TextField。
请注意,这只适用于使用驯鹿主题和默认背景颜色#F5F5F5。如果您使用其他主题或背景颜色与原始颜色不同,则必须稍微调整一下。
vaadin css,CSS标签样式Vaadin相关推荐
- [JS,CSS] - CSS圆角框组件
来源:http://www.cnblogs.com/binyong/archive/2009/12/11/1621484.html 下载地址:http://files.cnblogs.com/biny ...
- simple css 汉化,Simple CSS(CSS文档生成器)
Simple CSS(CSS文档生成器)简介 Simple CSS(CSS文档生成器)简介一:Simple CSS是一款CSS文档生成器,帮助网页开发人员快速生成CSS样式,Simple CSS使用非 ...
- [css] css常用的布局方式有哪些?
[css] css常用的布局方式有哪些? 1:圣杯布局 2:双飞翼 3:flex 个人简介 我是歌谣,欢迎和大家一起交流前后端知识.放弃很容易, 但坚持一定很酷.欢迎大家一起讨论 主目录 与歌谣一起通 ...
- [css] css的属性content有什么作用呢?有哪些场景可以用到?
[css] css的属性content有什么作用呢?有哪些场景可以用到? content属性与 ::before 及 ::after 伪元素配合使用生成文本内容通过attr()将选择器对象的属性作为字 ...
- [css] CSS的伪类和伪对象有什么不同?
[css] CSS的伪类和伪对象有什么不同? 伪类是给当前选中节点添加新样式, 伪对象是给当前选中节点添加伪元素. 伪类选择器使用:,伪对象选择器使用::,因为兼容旧版,所以伪对象使用:也能解析. 个 ...
- [css] CSS中的calc()有什么作用?
[css] CSS中的calc()有什么作用? 用来计算长宽的属性,非常好用,百分比,px,vh/vm都可参与计算, 不过正如上面的大兄弟说的,运算符的左右要有空格,要不然不生效 个人简介 我是歌谣, ...
- [css] css怎样使每个字符宽度一样?
[css] css怎样使每个字符宽度一样? 控制字符间距:letter-spacing:1em;[em,px,rem] 个人简介 我是歌谣,欢迎和大家一起交流前后端知识.放弃很容易, 但坚持一定很酷. ...
- [css] css中的border:none和border:0px有什么区别?
[css] css中的border:none和border:0px有什么区别? none是没有边框. 0px是边框的宽度为0px. 个人简介 我是歌谣,欢迎和大家一起交流前后端知识.放弃很容易, 但坚 ...
- [css] css的linear-gradient有什么作用呢?
[css] css的linear-gradient有什么作用呢? 概念:线性渐变,向下/向上/向左/向右/对角方向,为了创建一个线性渐变,你必须至少定义两种颜色结点.颜色结点即你想要呈现平稳过渡的颜色 ...
- [css] css怎么更改表单的单选框或下拉框的默认样式?
[css] css怎么更改表单的单选框或下拉框的默认样式? 下拉框select可以通过appearance:none去除默认样式,然后进行自定义,但是option标签不能通过CSS自定义,所以最佳方案 ...
最新文章
- 循环爬取图片_Java爬取简单的网页内容和图片
- Cissp-【第5章 身份与访问管理】-2021-3-14(601页-660页)
- F - Tmutarakan Exams URAL - 1091 -莫比乌斯函数-容斥 or DP计数
- Java基础--继承、this、super、抽象类
- java做的一个将中文转换成Unicode码的工具类【转载】做个标记,明天研究下
- 12.20今日头条实习面试总结-算法工程师
- 印度18岁天才少年,造出“全球最小卫星”,实力不容小觑!
- TestNG参数化测试
- 《李焕英》票房反超,全靠《唐探3》衬托?
- 整个行业都缺Web前端工程师,你还在问Web前端工作好找吗?
- 用python实现中文词云完整流程(wordcloud、jieba)
- 两种排序方法(直接判断)
- 智乃的01串打乱(思维+暴力)
- 使用solrj api操作solr
- Redis ,Memcached ,Mongodb 对比
- android surfaceview view 区别
- 《C语言程序设计:问题与求解方法》——2.15节算术表达式
- 微信小程序input只允许输入数字
- css中flex设置为1是什么意思
- Datawhale组队学习21期_学术前沿趋势分析Task2_论文作者统计
热门文章
- 什么是API,说人话!
- python中e的x次方_e的x次方求导公式
- itop exynos4412 lcd驱动 详细分析 (一)
- F411-WeAct(二)IIC 驱动SSD1306 OLED(0.96寸)
- qt.qpa.plugin: Could not load the Qt platform plugin “xcb“
- 10G SFP+和40G QSFP+光模块在数据中心的光互连解决方案
- 7和7的倍数游戏答案_一道数学题和一个数学游戏,二年级会孩子选哪个?
- HihoCoder - 1789
- 数仓缓慢变化维SCD深度讲解
- 股价暴涨59%后,美股二手车平台Carvana在短期内还会进一步上涨?