-
编程语言
站-
热门城市 全国站>
-
其他省市
-
-
400-636-0069
小标
2018-12-26
来源 ：
阅读 1401
评论 0
摘要：本文主要向大家介绍了JAVA语言之AngularJS下用ng-style动态改变样式的代码，通过具体的内容向大家展示，希望对大家学习JAVA语言有所帮助。
本文主要向大家介绍了JAVA语言之AngularJS下用ng-style动态改变样式的代码，通过具体的内容向大家展示，希望对大家学习JAVA语言有所帮助。
AngularJS使用ng-style动态改变样式，代码如下：
01 <!doctype html>
02 <html lang="en">
03 <head>
04 <meta charset="UTF-8" />
05 <title>Document</title>
06 <style type="text/css">
07 .ng-cloak{display:none;}
08 </style>
09 </head>
10 <body ng-app="app" ng-controller="ctrl" ng-cloak class="ng-cloak">
11 <input type="text" ng-model="color" />
12 <input type="number" ng-model="num" />
13 <p ng-style="{'color':color, 'fontSize':num+'px'}">赵一鸣技术博客</p>
14 </body>
15 </html>
16 <script type="text/javascript" src="//www.zymseo.com/js/angular.min.js"></script>
17 <script type="text/javascript">
18 var m = angular.module('app', []);
19 m.controller('ctrl', ['$scope', function($scope){
20
21 }]);
22 </script>
注意：ng-style里边是json格式，与jquery定制css样式类似，比如字体大小应该是fontSize，而不是font-size.
本文由职坐标整理并发布，希望对同学们有所帮助。了解更多详情请关注编程语言JAVA频道！
喜欢 | 0
不喜欢 | 0
您输入的评论内容中包含违禁敏感词
我知道了
请输入正确的手机号码
请输入正确的验证码
您今天的短信下发次数太多了，明天再试试吧！
我们会在第一时间安排职业规划师联系您！
您也可以联系我们的职业规划师咨询：
版权所有 职坐标-一站式IT培训就业服务领导者 沪ICP备13042190号-4
上海海同信息科技有限公司 Copyright ©2015 www.zhizuobiao.com，All Rights Reserved.
沪公网安备 31011502005948号
索取资料
答疑解惑
技术交流
职业测评
面试技巧
高薪秘笈
