Simple is Happiness
Less is more
前端
Animate.css让添加CSS动画像喝水一样容易
by newghost keys JS开源 前端 1410335021078
animate.css是一堆很酷的,有趣的,跨浏览器的动画效果库,你可以随意在你的项目中使用。用在你想要突出的任何地方,如主页,滑块,这像喝水一样容易,迷死人了。 下面是一个动画元素示例:

<h1 class="animated bounceOut">Animate.css</h1>
CSS垂直水平完全居中手册
by ourjs keys 心得体会 前端 1409885751786

居中一直是CSS中被抱怨的典型。为什么实现起来这么辛苦?所以有人被嘲笑。我觉得问题不是没有办法做到,只是视情况而定,有很多不同方式,但是很难弄清楚应该用何种方式。

因此我写了这篇文章,希望能把他变得容易点。

前端开发薪资之各地区对比(图文分析)
by kaka keys 挨踢职场 前端 1409808326809
发现最近大家都在关注有关前端开发的薪资问题,不同地方各有差异,今天我就总结一下发出来方便大家的查阅。
前面给大家介绍了关于前端开发需要学习的东西,根据你掌握的技能程度,薪水是不一样的。div+css,js会套用效果的4k到6k,新手熟悉切图,工作效率高的5k左右。有两年工作经验的,会ajax,可以手写代码,就是指常用的单词不用靠编辑器,了解一门后台语言(最好是php),不低于8k。对原生js有非常深入的研究,开发组件,框架库之类的,12k+,最低10k。最近比较流行移动终端,会这些的可能会更高一点的。
自己动手写CSS流式(响应式)布局
by ourjs keys 技术前沿 前端 1408003035180

在CSS中,你可以使用一个小标记来表示分栏的样式,并且自适应页面的大小。CSS的分栏是一个有趣的选项,简单的几行CSS代码即可创建响应式且向后兼容的流式布局。目前已经支持IE10+, Firefox, Chrome等主流浏览器,以下是几行代码,即可将一段文字分成两栏。 (PS: 当页面总宽度放不下两栏时,则会自动分为一栏,  如Chrome中 width < 400px)


  article{
    -webkit-columns: 2 200px;
       -moz-columns: 2 200px;
            columns: 2 200px;
  }  
前端工作面试问题集锦
by ourjs keys 求职面试 前端 1407549114660
注: 我们之前介绍过 JavaScript专业八级测试,其中很多问题都体现了JavaScript中的"坑"一面,实现工作中并不常用到(不过也许能帮助你更好地理解JS);这个开源项目所列问题则比较接地气,大部分都应该是前端程序必须掌握的。(由于中外表述上有差异,某些问题的意图理解起来可能有一定难度):

  • 你如何对网站的文件和资源进行优化?(期待的解决方案包括:文件合并,文件最小化/文件压缩,使用 CDN 托管,缓存的使用,其他)

  • 为什么利用多个域名来提供网站资源会更有效?(浏览器同一时间可以从一个域名下载多少资源?)

  • 请解释一下 * { box-sizing: border-box; } 的作用?并且说明使用它有什么好处?

  • 描述以下变量的区别:nullundefined 或 undeclared?(该如何检测它们?)

  • 为什么扩展 JavaScript 内置对象不是好的做法?

  • 请解释变量声明提升。* 示例 var v='Hello'; (function(){ alert(v); var v='love'; })();


项目地址: 
https://github.com/darcyclarke/Front-end-Developer-Interview-Questions
有可能将CSS应用到一个字符的一半吗?
by 1518409521 keys 编程技巧 前端 1407080078469

我在寻找

给一个字符的一半设置样式。(在本例中,字符的一半是透明的)

下面是目前我所寻找和尝试的:

  • 将样式应用于字符或者字母的一半的方法
  • 用CSS或JavaScript给字符部分设置样式
  • 给字符的50%应用CSS

下面是一个例子,我想要获得的效果。

CSS字体大小: em与px、pt、百分比之间的对比
by 1518409521 keys 心得体会 前端 1405687703167

CSS样式最混乱的一个方面是应用程序中文本扩展的font-size属性。在CSS中,你可以用四个不同的单位度量来显示在web浏览器中的文本大小。这四个单位哪一种最适合Web? 这个问题引起了广泛的争论。找到一个确定的答案是困难的, 因为这个问题,本身就是如此难以回答。

当你动态地观察他们就很容易理解字体大小单位之间的区别。

一般来说:1 em = 12 pt = 16 px = 100%

当使用这些font-size, 增加基础本字体大小(使用CSS选择器)从100%到120%,让我们看看会发生什么。

怎样才能成为优秀的前端开发工程师
by monkey keys 挨踢职场 前端 1404894319288
多刚入门的前端攻城师会有一个疑问:如何才能成为一名优秀的前端工程师呢?其实这个问题说大也大,说小也小,展开了说可以写一本书。当然我相信大部分人并不希望去读一本厚厚的书,大道至简,下面总结的几条方法或许能成为走向优秀前端的进阶之路。1. 多写。很多问题都是积累得来的。写了,遇到了,才能去真正理解解决方案,才会随着自己的不断成长而有进步。
Google 的 Web Starter Kit
by tyler keys JS开源 前端 1404270184645
Web Starer Kit 是一个来自Google的构建响应式网站的模板。支持不同的设备,并且由gulp.js 构建,同时支持跨设备同步测试。如果你是一个Node 开发者,你应该会喜欢基于gulp.js的开发环境。通过在命令行中输入 gulp 可以构建和组织当前项目,而输入 gulp serve 将会运行一个服务器,同时也可以通过输入 gulp pagespeed 来使用Google 的 PageSpeed insights (一个网站分析工具)
功夫:HTML和CSS?
by 1518409521 keys 编程技巧 前端 1399821964189
这本书讲解了HTML和CSS可能会使你说什么他妈的原因,它例举了一系列通常令人沮丧的HTML和CSS困境,窘境甚至失策的地方。

HTML文件总是包含一个文档类型,我推荐HTML5的简单文档类型:

<!DOCTYPE html>

 近期热门 - 点击最多
  1. Html5网页中用JavaScript调用本地手机摄像头扫描识别微信二维码、条形码:postMessage跨域https传递扫码结果消息
  2. JavaScript设置对象属性只读不可修改、不可枚举、不可删除:Object.defineProperty
  3. CSS教程:图片使用混合模式和颜色叠加filter滤镜,改变PNG图标颜色
  4. CSS教程:如何设置自动显示隐藏scrollbar滚动条,自定义外观样式/宽度,附demo示例大全
  5. node.js通过Error.prepareStackTrace获取上层调用函数的文件名地址和行数位置
  6. JavaScript判断字符串是否为数字类型:Number.isInteger、isNaN、正则表达式比较
  7. webpack前端项目调试环境安装入门:webpack.config.js禁用UglifyJs只合并JavaScript不压缩混淆代码
  8. node.js创建aria2代理服务器:使用net.socket转发rpc或http request请求,替换websocket
  9. request停止维护:用node.js实现http网页爬虫抓取,模拟ajax\post请求,大文件上传下载
  10. 用node.js在Windows或Linux平台上高性能解压/压缩zip、tar大文件,输出到文件或Stream流

  全端社区 - 最新回复
  1. Html5网页中用JavaScript调用本地手机摄像头扫描识别微信二维码、条形码:postMessage跨域https传递扫码结果消息
  2. JavaScript设置对象属性只读不可修改、不可枚举、不可删除:Object.defineProperty
  3. CSS教程:图片使用混合模式和颜色叠加filter滤镜,改变PNG图标颜色
  4. CSS教程:如何设置自动显示隐藏scrollbar滚动条,自定义外观样式/宽度,附demo示例大全
  5. node.js通过Error.prepareStackTrace获取上层调用函数的文件名地址和行数位置
  6. JavaScript判断字符串是否为数字类型:Number.isInteger、isNaN、正则表达式比较
  7. 小程序未来肯定会朝着这些方面发展,企业必须做好!
  8. Debian/Ubuntu Linux搭建SVN服务器,并设置开机默认启动
  9. 小程序跳转功能,带来的多个改变!
  10. WeMall用Node.js语言开发的单用户商城(微信端)商城源码

  开源的 OurJS
OurJS开源博客已经迁移到 OnceOA 平台。

  关注我们
扫一扫即可关注我们:
OnceJS

OnceOA