Ioniccss主要由以下4部分组成
1.基本布局类
2.颜色和图标类
3.界面组件类
4.栅格系统类
一、布局
1.定高条块定义
.bar——将元素声明为屏幕上绝对定位的块状区域,具有固定的高度(44px)
效果截图
2.条块位置
.bar-header - 置顶
.bar-subheader - header之下置顶
.bar-footer - 置底
.bar-subfooter - footer之上置底
3.内容
.content - 流式定位,内容在文档流中按顺序定位
.scroll-content - 绝对定位,内容元素占满整个屏幕
4.bar子元素
有三种.bar子元素的样式是预定义的:
...
标题文字- 对包含标题文字的元素应用.title样式,通常使用h1元素。
按钮- 对用作按钮的元素,应用.button样式,通常使用button 或a元素作为按钮。注意按钮将使用.bar的配色方案。
工具栏- 工具栏包含一组按钮。对用作工具栏的元素,应用.button-bar样式,通常 使用div元素作为工具栏。
5.bar嵌入input
在条块元素上应用.item-input-inset样式
将input包裹在应用.item-input-wrapper样式的元素内