Ionic css组成（一）

2019独角兽企业重金招聘Python工程师标准>>>

Ionic css主要由以下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子元素的样式是预定义的：

<any class="bar">

<any class="title">...</any>

</any>

标题文字 - 对包含标题文字的元素应用.title样式，通常使用h1元素。

按钮 - 对用作按钮的元素，应用.button样式，通常使用button 或a元素作为按钮。注意按钮将使用.bar的配色方案。

工具栏 - 工具栏包含一组按钮。对用作工具栏的元素，应用.button-bar样式，通常 使用div元素作为工具栏。

5.bar嵌入input

在条块元素上应用.item-input-inset样式

将input包裹在应用.item-input-wrapper样式的元素内

 

 

转载于:https://my.oschina.net/u/2971691/blog/867349