[DikeJS]RequireJS引入CSS样式文件(五)_html/css_WEB-ITnose
程序员文章站
2024-01-09 21:12:28
...
在实际开发组件时,我们常常需要关注组件的样式,样式如何定义,以及样式如何引用,我关注此问题时也纠结了一小下,不过还好,RequireJS周边给我们提供了丰富的插件,我们可以直接使用css.js,具体的使用方法如下:
(function () { requirejs.config({ paths: { jquery : 'lib/jquery-1.11.1.min', Template : 'Component/util/Template', Button : 'Component/view/button/Button', Canvas : 'Component/view/canvas/Canvas', Container: 'Component/view/container/Container' }, /** * 设置css.js文件路径 */ map : { '*': { 'css' : 'lib/css' } }, /** * 样式按照需要加载加载 键值名和加载模块的名称一致,目的是加载模块时加载对应的css样式 */ shim : { 'Canvas1': ['css!./Component/view/canvas/css/login.css'], 'Button' : ['css!./Component/view/button/css/ty-main.css'] } }); define(function (require) { var $ = require('jquery'); $(document).ready(function () { var container = new (require('Container'))({ id : 'container', name : 'container', width : '300px', height: '500px', render: $('body') }); var canvas = new (require('Canvas'))({ id : 'Canvas', name : 'Canvas', //render : $('body'), listeners: { onReady: function (_this) { var ctx = _this.getContext2D(); ctx.fillStyle = '#FF0000'; ctx.fillRect(0, 0, 80, 100); }, click : function () { alert(1); } } }); container.add(canvas); }); }); })();
请仔细查看注释,你就明白如何引入css样式了,而且是在初次加载页面的时候就会将css样式写入到
以上就是[DikeJS]RequireJS引入CSS样式文件(五)_html/css_WEB-ITnose的内容,更多相关内容请关注PHP中文网(www.php.cn)!
推荐阅读
-
[DikeJS]RequireJS引入CSS样式文件(五)_html/css_WEB-ITnose
-
怎么在html制定标签ul中 引入 文件里面的html片段_html/css_WEB-ITnose
-
CSS+div-页面div的的命名规范-样式文件的命名规范_html/css_WEB-ITnose
-
文件图标css样式_html/css_WEB-ITnose
-
win8专业版 ie10和360浏览器无法加载本地html网页的css样式文件_html/css_WEB-ITnose
-
ajax加载html文件并执行其中的js代码,加载css样式_html/css_WEB-ITnose
-
jsp文件中的CSS样式为什么在dreamweaver中能显示,而在myeclipse经过tomcat服务器就不行?_html/css_WEB-ITnose
-
怎样用纯HTML和CSS更改默认的上传文件按钮样式_html/css_WEB-ITnose
-
DWZ富客户端,没有引入CSS和JS文件,但是同样有效果.在线等_html/css_WEB-ITnose
-
2015-09-21CSS:引入方式、选择器、注释、文字样式_html/css_WEB-ITnose