Front End
文章平均质量分 76
lujie_1996
精通C++、Java语言,6年软件开发经验,编写了30余个大中型项目。热衷于ACM竞赛和算法,在OJ上完成千余题,并多次参加ACM-ICPC亚洲区域赛和省赛,取得银奖、铜奖各3项的好成绩。曾举办过两次大学生程序设计大赛,负责命题、环境部署和判题服务器的维护,吸引了近100支队伍(约300人)参与。
展开
-
HTML+CSS实现倒三角符号
在网页设计中通常需要实现倒三角符号的效果,比如下图当当网的搜索框:那么,我们做出的最终效果是这样的: .nabla { width: 0px; height: 0px;原创 2017-09-11 13:49:32 · 15639 阅读 · 0 评论 -
JavaScript实现简易计算器
从input取值并将值放入input2的操作:var value = document.getElementById(“input”).value;document.getElementById(“input2”).value =value; 最终效果 实现代码 简易计算器 * { font: normal normal 18px "黑体原创 2017-10-06 19:24:18 · 467 阅读 · 0 评论 -
网页上截取显示图片的一部分
前端工程师在制作网页图标时,通常会将诸多精灵放在一张图片上,然后采用截取的方式在网页上显示出来,那么应该这样截取呢?下面分别使用div背景和img两种方式来演示。 显示效果 实现代码 * { padding: 0; margin: 0; font-weight: bold; } #pic { width: 15原创 2017-10-06 19:45:34 · 1594 阅读 · 0 评论 -
HTML+CSS实现静态注册页面
最终效果 实现代码 注册页 * { padding: 0; margin: 0; font-size: 15px; } .red { margin: 0 auto; width: 650px; color: #D22; } .blue { font-weight: bold; color: #22F;原创 2017-10-05 19:28:31 · 6866 阅读 · 0 评论 -
JavaScript实现存款利息计算器
最终效果 实现代码 * { font: normal normal 15px "微软雅黑"; } div { width: 380px; margin: 0 auto; } table { margin: 20px auto; } input { width: 180px; height: 20px;原创 2017-10-13 23:11:23 · 5684 阅读 · 1 评论 -
JavaScript仿记事本的替换功能
最终效果 实现代码 * { font-family: "黑体"; } h1 { font-size: 24px; text-align: center; } #center { width: 420px; margin: 0 auto; } .right { text-align: right; }原创 2017-10-14 15:36:58 · 808 阅读 · 0 评论 -
使用 CSS3 实现转盘抽奖效果
微信和大型商场常常会有转盘抽奖的活动,比如上海移动和教授的抽取积分活动等。我们可以通过CSS3的transform属性来实现转盘的旋转。同时,transition属性实现过渡动画,它具有四个子属性,依次为1. transition-property(过渡属性,默认为all)2. transition-during(过渡时间,默认0s)3. transiti原创 2018-01-09 17:54:11 · 12334 阅读 · 0 评论