请上传宽度大于 1200px,高度大于 164px 的封面图片
    调整图片尺寸与位置
    滚轮可以放大缩小图片尺寸,按住图片拖动可调整位置,多余的会自动被裁剪掉
取消
xiaomili(uid:263479)
2021年加油! 职业资格认证:FCA-FineReport | FCA-FineBI
【模板分享】制作了一个简单的公文发布模板
1、制作一个填报模板,录入公文的各项内容; 2、再制作一个移动端模板,可以用手机端录入手写签名发布上去;放在公文印章的地方; 3、最后制作一个预览的模板,选择刚才发布的公文,也可以导出为pdf文件,用于打印; 4、模板简陋,有待完善!!! 模板含建表语句.rar (587.62 K)
仿华为太空人手表(含模板附件)
是不是和huawei手表一样滴^_^ 附件分享给大家玩玩, css文件和js文件放在..webroot/help/css和..webroot/help/js文件夹里面, taikong-img文件夹放在..webroot/help/img文件夹里面就可以了; 太空人.rar (1.05 M) 预览模板双击鼠标有彩蛋哈哈哈;   编辑于 2021-9-28 10:12
仿苹果动态时钟图标-分享给大家参考;
此文档是在10.0版本的cpt模板中测试的,使用分页预览展示的效果图; frm模板还未测试哈; 首先,新建cpt模板,选择一个单元格,输入以下内容;   <div class="icon-large icon-clock"> <div class="clock"> <ol> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> <li></li> </ol> <div id="div-hour" class="hour" style="transform: rotate(459.166deg);"></div> <div id="div-minute" class="minute" style="transform: rotate(5419.66deg);"></div> <div id="div-second" class="second" style="transform: rotate(325180deg);"></div> </div> </div> 如图,单元格显示内容设置‘用HTML显示内容’; 然后,模板web属性-插入加载结束事件的代码: !(function (win, doc) { win.requestAnimationFrame = win.requestAnimationFrame || win.webkitRequestAnimationFrame || win.mozRequestAnimationFrame || window.msRequestAnimationFrame; var hour = doc.getElementById("div-hour"), minute = doc.getElementById("div-minute"), second = doc.getElementById("div-second"); var start = function () { // 当前时间 var now = new Date(), // 午夜12点整 midnight = new Date(now.getFullYear(), now.getMonth(), now.getDate(), 0, 0, 0), // 当前时间与午夜12的之间的毫秒差 ms = now.getTime() - midnight.getTime(), // 计算时、分、秒 hh = ms / (1000 * 60 * 60), mm = hh * 60, ss = mm * 60; // 实现时钟旋转 hour.style.transform = "rotate(" + (hh * 30 + (hh / 2)) + "deg)"; minute.style.transform = "rotate(" + (mm * 6) + "deg)"; second.style.transform = "rotate(" + (ss * 6) + "deg)"; win.requestAnimationFrame(start); } win.requestAnimationFrame(start); })(window, document); 再给模板添加css文件,确定保存; body,html{height:90%;background:linear-gradient(to right, #3f95ea, #12eeee);position:relative;} .icon-large{width:220px;height:220px;border-radius:38px;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)} .icon-clock{overflow:hidden;background:#000} .clock{width:192px;height:192px;border-radius:50%;background:#f1f1f1;position:absolute;top:50%;left:50%;transform:translate(-50%,-50%)} .clock ol{list-style-type:none;width:100%;height:100%;position:relative;margin:0;padding:0} .clock ol li{counter-increment:labelCounter;position:absolute;font-size:1.25em} .clock ol li:before{font-family:Helvetica;content:counter(labelCounter) ""} .clock ol li:nth-child(1){right:55px;top:20px} .clock ol li:nth-child(2){right:25px;top:50px} .clock ol li:nth-child(3){right:12px;top:85px} .clock ol li:nth-child(4){right:25px;top:125px} .clock ol li:nth-child(5){right:55px;top:150px} .clock ol li:nth-child(6){right:90px;top:160px} .clock ol li:nth-child(7){right:125px;top:150px} .clock ol li:nth-child(8){right:155px;top:125px} .clock ol li:nth-child(9){right:165px;top:85px} .clock ol li:nth-child(10){right:150px;top:50px} .clock ol li:nth-child(11){right:120px;top:20px} .clock ol li:nth-child(12){right:85px;top:10px} .hour{width:14px;height:14px;border-radius:50%;background:#303030;position:absolute;top:50%;left:50%;margin-top:-7px;margin-left:-7px} .hour:after,.hour:before{content:"";display:block;position:absolute} .hour:before{width:8px;height:65px;border-radius:4px;background:#303030;position:absolute;bottom:2px;left:50%;transform:translate(-50%,0)} .minute{width:0;height:0;border-radius:50%;background:#303030;position:absolute;top:50%;left:50%} .minute:after,.minute:before{content:"";display:block;position:absolute} .minute:before{width:6px;height:85px;border-radius:4px;background:#303030;position:absolute;bottom:2px;left:50%;transform:translate(-50%,0)} .second{width:4px;height:4px;border-radius:50%;background:#ff8000;border:2px solid #ff8000;position:absolute;top:50%;left:50%;margin-top:-4px;margin-left:-4px} .second:after,.second:before{content:"";display:block;position:absolute} .second:before{width:2px;height:105px;border-radius:4px;background:#ff8000;position:absolute;bottom:-12px;left:50%;transform:translate(-50%,0)}  最后,点击分页预览即可效果如图; 也可以放在frm模板的任意位置用于大屏展示,如下图: 有待完善哈,仅供参考!~   编辑于 2021-8-31 07:57 编辑于 2021-8-31 07:58 编辑于 2021-8-31 08:00 编辑于 2021-9-10 10:22 编辑于 2021-9-10 10:25
个人成就
内容被浏览128,756
加入社区5年17天
返回顶部