HTML5+CSS3前端开发资源整合

HTML5+CSS3前端开发资源整合

推个广告

个人网站:http://www.51pansou.com

HTML5视频下载:HTML5视频

HTML5源码下载:HTML5源码

meta相关:

<meta name="viewport" content="width=device-width,initial-scale=1.0,user-scalable=no"/>
<meta name="format-detection" content="telephone=no"/>
<meta name="format-detection" content="email=no"/>

CSS相关:

-webkit-overflow-scrolling:touch;快速滚动和回弹的效果,看上去和原生app的效率都有得一拼。-webkit-overflow-scrolling创建了带有硬件加速的系统级控件,所以效率很高。但是这相对是耗更多内存的,最好在产生了非常大面积的overflow时才应用。

 移动端字体

body {font-family: "Helvetica Neue", Helvetica, STHeiTi, sans-serif; /*使用无衬线字体*/}

 禁止长按链接与图片弹出菜单

a, img { -webkit-touch-callout: none; }
防止点击高亮,可以通过给a标签或者body,html加 
-webkit-tap-highlight-color:transparent;

 -webkit-appearance属性,来改变任何元素的浏览器默认风格

appearance:none|normal|icon|window|button|menu|field;
去掉webkit默认的表单样式
button,input,optgroup,select,textarea {-webkit-appearance:none; }
禁止选中文本
-webkit-user-select: none;

 去掉a、input和button点击时的蓝色外边框和灰色半透明背景

a,button,input,optgroup,select,textarea {-webkit-tap-highlight-color:rgba(0,0,0,0); }

 修改input的planceholder样式

input::-webkit-input-placeholder {color:#ccc;}

 修改表单获取焦点时的样式

input[type=text]:focus, input[type=password]:focus { border: 2px solid#f00;outline: none;}

 用CSS实现省略号文字截断

white-space: nowrap;text-overflow: ellipsis; 

个人网站:http://www.51pansou.com

HTML5视频下载:HTML5视频

HTML5源码下载:HTML5源码

作者:www.51pansou.com

时间: 2024-12-13 08:34:24

HTML5+CSS3前端开发资源整合的相关文章

移动WEB前端开发资源整合

meta篇 1.视窗宽度 <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.0,maximum-scale=1.0,user-scalable=no"/> 其中 width=device-width 是设置视窗宽度为设备视窗宽度,还可以固定宽度,例如: width=640 则是640px的宽度(常见于微信): initial-scale=

(转载)移动WEB前端开发资源整合

收藏起来,感谢原文大大:Bon~~~ 原文链接:http://www.ccwebsite.com/development-of-resource-integration-in-mobile-terminal/ ---------------------------------- meta篇 1.视窗宽度 <meta name="viewport" content="width=device-width,initial-scale=1.0,minimum-scale=1.

极客Web前端开发资源大荟萃

每周极客都将总结本周最精彩的素材提供给大家.希望能够带给你很多其它地灵感和帮助.极客#GB课程库#现已上线,不管你是0基础.中级.还是正在进修的高级前端project师.这里都将帮助你得到很多其它更高效的学习. #GB课程库# 极客Web前端开发资源大荟萃#001 怎样写出高性能的Jquery代码 讨论jQuery和javascript性能的文章并不罕见.然而,本文我计划总结一些速度方面的技巧和我本人的一些建议.来提升你的jQuery和javascript代码.好的代码会带来速度的提升.高速渲染

极客Web前端开发资源大荟萃#001

每周极客都将总结本周最精彩的素材提供给大家,希望可以带给你更多地灵感和帮助!极客#GB课程库#现已上线,无论你是初级.中级.还是正在进修的高级前端工程师.这里都将帮助你得到更多更高效的学习.原文:极客Web前端开发资源大荟萃#001 超棒的HTML5/CSS3单页面响应式模板(支持Bootstrap) 在线演示 使用Bootstrap实现的响应式单页面模板,包含移动和桌面两种效果. jQuery框架开发一个最简单的幻灯效果 在线演示 在这个课程中,我们将介绍如何使用jQuery来开发一个最简单的

[IOS_HTML5]各种JS框架介绍--用HTML5/CSS3/JS开发Android/IOS应用

现在人人都想成为安卓/IOS应用开发工程师.其实,安卓/IOS应用可以用很多种语言来实现.由于我们前端开发工程师,对HTML5/CSS/JavaScript的网络编程已经相当熟悉了.所以,今天大家将会认识到一些利用前端语言来开发安卓/IOS应用的工具. 在文章的末尾,也介绍了使用JAVA.C#.Lua以及AS3来开发安卓应用的工具. 希望大家都能找到适合自己的开发工具!祝大家开发安卓/IOS应用一切顺利! PhoneGap 开发语言: HTML, CSS, JavaScript 开发工具: Ph

最好的前端开发资源推荐

很早的一篇前端开发资源,今天才看到,里面有各种各样的开源资源,包括HTML5.CSS3.jQuery.PHP和JavaScript库等,每个资源都是比较热门的,你可以将它运用到你的项目中,或者可以纯粹的拿来学习,从各位前端大神的作品中成长. 这个前端开发资源类似于一个目录,大部分也许你都看过,也许也有一些新鲜的,不妨把它收藏起来当做一个前端开发网址书签,有点可惜的是,里面的网址都是国外的,所以你需要会英文. 学习HTML 5编程和设计 ★ HTML5 Rocks : Major Feature

极客Web前端开发资源大荟萃#002

每周极客都将总结本周最精彩的素材提供给大家,希望可以带给你更多地灵感和帮助!极客#GB课程库#现已上线,无论你是初级.中级.还是正在进修的高级前端工程师.这里都将帮助你得到更多更高效的学习. #GB课程库# 极客Web前端开发资源大荟萃#001 如何写出高性能的Jquery代码 讨论jQuery和javascript性能的文章并不罕见.然而,本文我计划总结一些速度方面的技巧和我本人的一些建议,来提升你的jQuery和javascript代码.好的代码会带来速度的提升.快速渲染和响应意味着更好的用

[转载]HTML5游戏前端开发秘籍

http://isux.tencent.com/html5-game-development-cheats.html 转载至腾讯ISUX HTML5游戏前端开发秘籍 本文由米随随编写 QQ空间Android版4.2和4.5上线的玩吧游戏“空间疯狂套牛”是一款使用HTML5开发出的手机游戏,虽然还有很多不足,但其中使用的一些技术与技巧还是很有必要为大家分享出来,方便大家用秘籍打通各种关卡创造出更多更好的HTML5游戏.(本秘籍主要讲述使用HTML + CSS技术方面) 一.自适应 Android手

响应式HTML5+CSS3 网站开发测试实践

仅仅利用media query适配样式是远远不够的,并没有考虑触屏下的行为和特有的内容组织方式的不同.简单在桌面版基础上叠加mobile版的代码,会带来请求增多.流量.性能.代码冗余等诸多方面问题.有统计说86%的手机站看起来small其实体积比桌面版还大. 我们这次充分发挥“响应”的灵活性,实现one web. 响应式开发就为了实现one web: 1. 响应性的模块原本网站的模块化程度越高越便于做响应性开发.一个page例如是这样组织的:<%include file=”path/mod1.h