最新统计:5453800 名前端工程师,270042 篇优秀笔记,23326 个前端问题被解决,977 家高端企业入驻,1 个网站,1 个共同的家园!

让梦想更容易实现

前端网友最新动态:

加关注有惊喜:新浪微博腾讯微博
  • pingfan国庆作品-只想对你说,国庆节快乐

    国庆作品-只想对你说,国庆节快乐

    上次做了中秋作品-《只想对你说》,这次再塑经典再来一个国庆作品-《只想对你说,国庆节快乐》…… 其中主要亮点,就是加了歌曲和歌词联动的效果…… 程序员文词不好,直接上代码呢…… 访问链接地址(请用高级浏览器访问,手机微信浏览器访问功能最全,效果最佳)

  • hugeannex为新公司做的一个简单的webApp

    为新公司做的一个简单的webApp

    公司的设计师很多,可没web的设计师,所以在设计上感觉还是有点欠缺,但UI的事俺们前端没法管,还是做好自己份内的事吧。 这webApp主要思考是在首页上,其它页面就是一般的设计模式。 思路在首页上那是因为首页图片不少。用大图吧,很占手机的流量;用小图吧,在P

  • 炼心新手一起学手机网页制作(二)——重置样式1

    新手一起学手机网页制作(二)——重置样式1

    这章,主要一起学学手机网站的样式重置。同样内容基本都来自于w3cplus。后面增加了自己对一些我不懂的属性的查阅,希望能帮到大家。 http://www.w3cplus.com/mobile/mobile-terminal-refactoring-reset-style.html 【自我总结问题1:移动端网页推荐使用rem做单

  • iyangjavascript编码风格

    javascript编码风格

    javascript编程风格 所谓"编程风格"(programmingstyle),指的是编写代码的样式规则。程序员固然可以自由选择编程风格,但是好的编程风格有助于写出质量更高、错误更少、更易于维护的程序。"编程风格"的选择不应该基于个人爱好、熟悉程度、打字工作量等因素,

  • 颖格格前端工程师你们伤不起!!

    前端工程师你们伤不起!!

    前端工程师伤不起 老子几年前进了互联网圈!!!!!!!成了前端工程师,名字是不是很拉风,有木有!!!!!!!! 尼玛跟老子讲前台代码简单!!!出入高级写字楼,薪水高!!!!!!!!!!!!!!!! 入行才2K起啊!!!!2K在帝都都够毛用啊!!!! 尼

  • iyang12种不宜使用的Javascript语法

    12种不宜使用的Javascript语法

    内容来自javascript语言精粹 1.== Javascript有两组相等运算符,一组是==和!=,另一组是===和!==。前者只比较值的相等,后者除了值以外,还比较类型是否相同。 请尽量不要使用前一组,永远只使用===和!==。因为==默认会进行类型转换,规则十分难记。如果你不相信的

  • iyang用Javascript获取页面元素的位置

    用Javascript获取页面元素的位置

    又读到一些好的东西,和大家分享 1.网页的大小和浏览器窗口的大小 一张网页的全部面积,就是它的大小。通常情况下,网页的大小由内容和CSS样式表决定。 浏览器窗口的大小,则是指在浏览器窗口中看到的那部分网页面积,又叫做viewport(视口)。 如果网页的内容能够

  • Rainy°工作笔记,如何将一个地址的参数转换成json

    工作笔记,如何将一个地址的参数转换成json

    //str='?a=1&b=2&c=3' //先获取到所有的参数 varstr=window.location.search; //去掉?号 str=str.substring(1); //通过&将地址参数切成数组 vararr=str.split('&'); varjson={}; //循环该数组 for(vari=0;i<arr.length;i++) { //再将数组里的每一个通过=再

  • xinquanwudi一个js简写技巧

    一个js简写技巧

    (function(oData){ varlen; if(oData){ len=oData; }else{ len=10; } alert(len); } )();复制代码 简写成 (function(oData){ varlen=oData||10; alert(len); } )();复制代码

  • 让我消停下行吗百度2015校园招聘前端笔试题(西安站)

    百度2015校园招聘前端笔试题(西安站)

    (考试时间:120min) 1.列举你所知道的HTML行内元素、块级元素和空(void)元素。(10分) 2.请简述CSS加载方式link和@import的区别。(8分) 3.请简述javascript延迟加载的方式。(10分) 4.下列代码执行后,x、y、z的值各为多少?(12分) varx=1,y=z=0; functionadd

  • zhonghaisheng百度知道文章分段读效果

    百度知道文章分段读效果

    <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlns="http://www.w3.org/1999/xhtml"> <head> <metahttp-equiv="Content-Type"content="text/html;c

  • Is华丽前端学习资料汇总(转)

    前端学习资料汇总(转)

    前端工具: canisee:http://caniuse.com/——一个查看css及html5在各个浏览器及手机端的支持情况 前端视野:——平时可以多看看的网站了解下最新资讯 前端观察站,腾讯的前端技术,挺有含金量: html5中国:http://www.html5cn.org/——有很多html及css小知识的网

  • 波克比整理如何实现响应布局

    整理如何实现响应布局

    一、什么是响应式布局?   响应式布局是EthanMarcotte在2010年5月份提出的一个概念,简而言之,就是一个网站能够兼容多个终端——而不是为每个终端做一个特定的版本。这个概念是为解决移动互联网浏览而诞生的。   响应式布局可以为不同终端的用户提供更加舒适

  • pengleihp(转)CSS z-index 属性的使用方法和层级树的概念

    (转)CSS z-index 属性的使用方法和层级树的概念

    关于css的理解,在网上看到一篇不错的文章,很好的理解了一把CSSz-index属性的使用方法和层级树的概念

  • yorky五、CSS3选择器

    五、CSS3选择器

    1、属性选择器 在HTML中,通过各种各样的属性可以给元素增加很多附加的信息。例如,通过id属性可以将不同div元素进行区分。 在CSS2中引入了一些属性选择器,而CSS3在CSS2的基础上对属性选择器进行了扩展,新增了3个属性选择器,使得属性选择器有了通配符的概念,这三

  • xiaohuangji2015去哪儿笔试

    2015去哪儿笔试

    一.画出对应的显示; <divclass="div1"></div> <divclass="div2"></div> 根据给定css画出其在文档中的显示 (为了便于查看效果,加上了背景色) (a).div1{width:200px;height:200px;border:1pxsolidred;position:absolute;float:left;} .

  • sidepeng前端开发到底需要掌握哪些知识? 浅谈前端开发的水有多深

    前端开发到底需要掌握哪些知识? 浅谈前端开发的水有多深

    但凡从事互联网的人基本都会写几行html,用过Word的人用Dreamweaver也能做出规整的页面,所以大部分人会很自然地认为“页面的开发没什么技术含量,很简单”。不仅有这种普遍的认知,对从业者来说也有很多疑惑:做页面前端实现,没问题;兼容性,小case;图片集成,一直

  • 复数lsjJavascript制作的一个简单的计算器

    Javascript制作的一个简单的计算器

    中间有很多判断都是为了解决一些Bug==,可能还会有些Bug,感觉写得太复杂了。。。。 varcalculator=function(){ varinput=document.getElementsByTagName("input"); varviewExp=document.getElementById("viewExp"); varviewRes=document.getElementById("viewR

  • iyang清除浮动的原理和方法

    清除浮动的原理和方法

    浮动元素容器的clearing问题 1.问题的由来 有这样一种情形:在一个容器(container)中,有两个浮动的子元素。 <div> <divstyle="float:left;width:45%;"></div> <divstyle="float:right;width:45%;"></div> </div> 在浏览器中

  • 晴天才微笑js小知识及一些常见易混淆的知识点

    js小知识及一些常见易混淆的知识点

    1.offsetleft=整数(可以是正,也可以是负数)。如果是浮点数,则始终向下取整 =90px,因为像素里没有小数,自动抛弃整数,表现为向下取整 2.区别 假设: body{ height:2000px } functiongetInfo() { vars=""; s+="网页可见区域高:"+document.bod

  • nicole_hf关于setTimeout同步和异步问题

    关于setTimeout同步和异步问题

    <scripttype="text/javascript"> functiontest(){ for(vari=0;i<5;i++){ setTimeout(function(){ alert(i)},100); } } test(); </script>复制代码 第一段代码中,开发人员的本意应该是每隔100毫秒将i的值加1输出,然而这段代码并不能达到上述目的,因为i

  • 唯美美【javascript】输入的数字必须在5-10位以上

    【javascript】输入的数字必须在5-10位以上

    <!DOCTYPEHTML> <html> <head> <metahttp-equiv="Content-Type"content="text/html;charset=utf-8"> <title>无标题文档</title> <script> window.onload=function(){ varoIn=document.getElementsByTagName('input'); oIn[

  • pure_lug从另一个静态页面传值

    从另一个静态页面传值

    从一个静态页面传值到另一个静态页面 s1.html <html> <head> <metacharset="utf-8"> <scripttype="text/javascript"> functionmessage(){ varlengt=document.getElementById("select_length").value; varwidth=document.getElementB

  • treejs--练习=数字时钟

    js--练习=数字时钟

    这算是Date()的练习吧 获取各种本地时间... //获取从1970年开始的毫秒数 document.write(oDate.getTime()+"毫秒"); //获取本地时间的秒数 document.write(oDate.getSeconds()+"秒"); //获取本地时间的分钟数 document.write(oDate.getMinutes()+"分

  • treejs--练习=延时显示

    js--练习=延时显示

    这个效果是看到QQ上面,把鼠标移动到头像上那种效果,感觉我只做了个大概出来吧 相对简单一点。。。就是弄了个鼠标经过和移开的事件 xxx.onmouseover=function(){ hover(); } xxx.onmouseout=function(){ out(); } 还有就是慢慢展开式加了css3的transition过

  • tianzitianxieJS根据汉字获取简拼

    JS根据汉字获取简拼

    <!DOCTYPEhtml> <htmllang="en"> <head> <metacharset="utf-8"> <!--AlwaysforcelatestIErenderingengine(eveninintranet)&ChromeFrame Removethisifyouusethe.htaccess--> <metahttp-equiv="X-UA-Compatible"con

  • Ann大然我也来滚一滚~~视差滚动

    我也来滚一滚~~视差滚动

    看到波可比写的笔记视差滚动学习了一下,自己也写了一个: 原理:1.利用background-attachment固定背景让其不随内容滚动2.不同元素设置不同的滚动速度,形成交错的视差 重点在第2点,如何做到不同速度? 主要是通过改变background-position的y来达到不同速度

  • pingfanhtml5 canvas时钟

    html5 canvas时钟

    基础知识点: canvas标签只是图形容器,您必须使用脚本来绘制图形。 getContext()方法可返回一个对象,该对象提供了用于在画布上绘图的方法和属性。——获取上下文对象。 getContext("2d")对象属性和方法,可用于在画布上绘制文本、线条、矩形、圆形等等。

  • 留住回首纯css3写的步奏框

    纯css3写的步奏框

    <!doctypehtml> <html> <head> <metacharset="utf-8"> <title>纯css3写的步奏框</title> <style> .step{position:relative;} .stepa{position:absolute;display:inline-block;color:#fff;} .stepaspan{display:inline-block;fl

  • 波克比未知高度的图片垂直居中显示

    未知高度的图片垂直居中显示

    方法一: <!DOCTYPEHTML> <html> <head> <metahttp-equiv="Content-Type"content="text/html;charset=utf-8"> <title>无标题文档</title> <style> .box{width:800px;margin:0auto;height:600px;border:2pxsolid#000;display:

  • iyang高质量css

    高质量css

    今天在阅读前端面试时,看到其中一条关于如何组织css,想起我曾经读过的一本编写高质量的代码中的高质量的css,将我感悟的东西做以下分享。 高质量的css: 标准模式和怪异模式以及DTD 1:标准模式中,浏览器根据规范表现页面,而怪异模式浏览器通常模拟老式浏览器

  • 晴天才微笑前端学习资料汇总(转)

    前端学习资料汇总(转)

    前端工具: canisee:http://caniuse.com/——一个查看css及html5在各个浏览器及手机端的支持情况 前端视野:——平时可以多看看的网站了解下最新资讯 前端观察站,腾讯的前端技术,挺有含金量: html5中国:http://www.html5cn.org/——有很多html及css小知识的网

  • kepinweb让我们一起来做一个好的Banner图片。

    让我们一起来做一个好的Banner图片。

      我们的网站,是由若干个“碎片”组成的,那么其中Banner的作用,想必大家都知道,或许很多朋友,对于亲手操刀Banner来说,事件不可想象的事情,自己审美不行、技术不行等,做不了,其实呢,Banner的制作很简单。   首先我们要知道,Banner不仅仅是装饰网站,更

  • Ling丶Q好久没来,打篇笔记(PNG8和PNG24的区别)

    好久没来,打篇笔记(PNG8和PNG24的区别)

    今天我做了一个图,因为需要透明,所以我存为了PNG8格式,结果发现图片变了,图片变得四周都 不光滑了,四周都变得有锯齿了,而且阴影也不见了,后来存为PNG24,这些问题就消失了。 我去百度搜索了关于PNG8和PNG24的区别,看到下面的文章,原来PNG8要么完全透明,要么

  • 唯美美【javascript】带有缩略图的,左右轮播图

    【javascript】带有缩略图的,左右轮播图

    <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <htmlxmlns="http://www.w3.org/1999/xhtml"> <head> <metahttp-equiv="Content-Type"content="text/html;c

如何通过@font-face在网页上使用字体

tanxuxu如何通过@font-face在网页上使用字体

以前我们为了能在网页上仍然保证和设计稿上的特殊字体一致,一般都切成图,但css3中提供了: @font-face:{

阿里巴巴2015校园招聘前端在线笔试题

让我消停下行吗阿里巴巴2015校园招聘前端在线笔试题

不用看下面勾选的答案(不一定对),看题目就好。 ----------------------------------------我是分割

伪元素 Before 和 After

pure_lug伪元素 Before 和 After

层叠样式表(CSS)的主要目的是给HTML元素添加样式,然而,在一些案例中给文档添加额外的元素是多余的或是

关于CSS如何控制HTML:4种方法(行内式,内嵌式,外部链接式,导入式))

faithfairy关于CSS如何控制HTML:4种方法(行内式,内嵌式,外部链接式,导入式))

【基础一】CSS如何控制页面 本节主要讲解,两个内容: 第一:CSS如何控制页面样式,有几种样式; 第二

引爆你的Javascript代码进化(转)

tanxuxu引爆你的Javascript代码进化(转)

方才在程序里看到一段JS代码,写法极为高明,私心想着若是其按照规范来写,定可培养对这门语言的理解,

写个八卦图,看下CSS3的强大。

kepinweb写个八卦图,看下CSS3的强大。

<style> .kepinweb_taiji{ position:relative; left:100px; top:100px; width:100px; height:100p

网页布局百叶窗效果

tanxuxu网页布局百叶窗效果

先运行看一下百叶窗效果是怎样的 <!DOCTYPEhtmlPUBLIC"-//W3C//DTDXHTML1.0Transitional//EN""http

阿里巴巴2015秋季校园招聘三部曲

kwooshung阿里巴巴2015秋季校园招聘三部曲

最近“让我消停下行吗”和“Blizzard”同学均发布了有关阿里巴巴校招方面的笔试题,看着很不错,故在此

小屌丝教你怎么一秒致富

tianxiaofeng747小屌丝教你怎么一秒致富

朋友,你想一夜暴富么?你想买豪车洋房吗?你想赢取女神吗?你想让那些看不起你的人大跌眼镜么? 方法除

IE6/IE7下:inline-block解决方案

wchy830IE6/IE7下:inline-block解决方案

1、inline元素(比如span,em等)的display属性设置为inline-block时,所有的浏览器都支持; 2、block元素的d

icomoon网站使用总结

maDaoicomoon网站使用总结

1.icomoon网址: https://icomoon.io/#home 2.icomoon作用: a.这个网站提供20+套,合计上千个不同风

CSS3滤镜——原来这么性感诱人

css3ChinaCSS3滤镜——原来这么性感诱人

今天在办公室亲眼目睹了同事使用CSS3滤镜为一张漂亮的照片轮廓加上了阴影,瞬间亮瞎了我的的双眼,见笑了。

搞点特效 CSS3

marchen搞点特效 CSS3

1.做个边框hover效果.思路:用css3的过渡效果.边框用span元素来绝对定位.然后改变位置就行了.原理图.(纯css,

淡定点!骚年

tianxiaofeng747淡定点!骚年

description:'最近一个月的工作都在学习angular和改一些小东西,所以不怎么忙,因为自己工作也3,4年了,

CSS3 正方体 三棱体

521fengxiaoCSS3 正方体 三棱体

看到有位同学写了个带动画的正方体,随即想到静态的正方体是否可以实现。趁着空闲,写了一下,有写的不好的

iScroll处理移动端滚动

pingfaniScroll处理移动端滚动

iScroll的历史 之所以iscroll会诞生,主要是因为无论是在iphone、ipod、android或是更早前的移动webkit

nodejs的安装配置

wc57242263nodejs的安装配置

1.下载最新版本的nodeJs http://www.nodejs.org/download/ 这里以v0.10.30为例,后面的文章都是 2.安

初见github

和尚初见github

github早段时间之前就在上边了,一直没有向上边传点东西,后来经过了阿里的笔试,觉得这东西还是要弄一下。

CSS3-- text-shadow写出来的文字效果

treeCSS3-- text-shadow写出来的文字效果

学了text-shadow,闲来没事,敲了几种文字效果,跟大家分享下。 <!DOCTYPEhtml> <htmllang="en

阿里巴巴2015秋季校园招聘前端开发工程师在线笔试题及答案

Blizzard阿里巴巴2015秋季校园招聘前端开发工程师在线笔试题及答案

前几天是阿里巴巴秋季校园招聘在线笔试的第一天,本着学习和共享的精神,本人上网百度了其中一份前端在线笔

极客学院

愚人节献礼《HTML5.Up.and.Running》 虽然是愚人节但终究还是个节日!好了献上《HTML5.Up.and.Running》,OReilly出品-你们

点击下载 »

前端必看的js书,js系统学习 psf扫描版文件过大,已发往百度空间,需要的同学可以猛戳下面的链接:http://pan.baid

点击下载 »
返回顶部