好迷惑,ionic 的 css component 和 JS component 是什么关系

html-css021

好迷惑,ionic 的 css component 和 JS component 是什么关系,第1张

我感觉界面效果差不多,直接用html的标签更好控制样式吧,如果使用它的标签添加样式有时会出现问题,之前用的使用ionic的时候也纠结过。。。ionic上很多坑,我觉得还不如直接使用cordova来的直接,至少自己能控制更多的界面。

第一步,创建静态页面tabs.html,默认是HTML5模板,如下图所示:

第二步,引入ionic相关的CSS文件和JS文件,如下图所示:

第三步,在body插入div和a标签元素,并设置样式,如下图所示:

第四步,预览该静态页面,这时会看到四个Tabs标签,如下图所示:

第五步,再次设置Tabs样式,使每个Tabs样式不一样,如下图所示:

第六步,下面插入AngularJS相关的指令,ng-app、ng-controlle指令,如下图所示:

第一步,打开HBuilder开发工具,并在创建好的web项目目录下创建静态页面select.html

第二步,引入ionic框架有关的CSS文件和JavaScript文件

第三步,在body标签元素内插入div,并设置样式item、item-input、item-select

第四步,在第一个div标签元素设置ng-app、ng-controller指令

第五步,利用AngularJS编辑代码,并给下拉框赋值,months有id和name

第六步,下拉框插入option

<select>

<option ng-repeat="mo in months" value="{{mo.id}}">{{mo.month}}</option>

</select>