HTML5和CSS3 - 随笔分类 - 雨为我停

关闭Android/iPhone浏览器自动识别数字为电话号码

摘要：iPhone上的Safari(还有些webkit android手机浏览器)会自动对看起来像是电话号码的数字串（包括已经加入连字符或括号格式化过的）添加电话链接，点击之后会询问用户是否想要拨打该号码。如果你不希望开启这个自动识别，可以将它关闭：如果你关闭自动识别后，又希望某些电话号码能够链接到iPh... 阅读全文

posted @ 2015-07-14 15:26 雨为我停阅读(296) 评论(0) 推荐(0) 编辑

border-radius 在安卓手机竟然不完美支持

摘要：如果给图片加了width:50px;height:50px;border-radius:25px;-webkit-border-radius:25px;border:3px solid #fff;在安卓手机里会出现下图的情况。白色边框竟然不是圆形的！！！解决方案中，img 外面套多个 div，把 b... 阅读全文

posted @ 2015-07-06 10:47 雨为我停阅读(907) 评论(0) 推荐(0) 编辑

多行文本溢出显示省略号(…)全攻略

摘要：http://www.css88.com/archives/5206大家应该都知道用text-overflow:ellipsis属性来实现单行文本的溢出显示省略号(…)。当然部分浏览器还需要加宽度width属性。overflow: hidden;text-overflow: ellipsis;whi... 阅读全文

posted @ 2015-05-19 15:20 雨为我停阅读(737) 评论(0) 推荐(0) 编辑

【转】移动web资源整理

摘要：目录（更新于20150311）meta基础知识H5页面窗口自动调整到设备宽度，并禁止用户缩放页面忽略将页面中的数字识别为电话号码忽略Android平台中对邮箱地址的识别当网站添加到主屏幕快速启动方式，可隐藏地址栏，仅针对ios的safari将网站添加到主屏幕快速启动方式，仅针对ios的safari顶... 阅读全文

posted @ 2015-04-21 17:41 雨为我停阅读(169) 评论(0) 推荐(0) 编辑

JS移动客户端--触屏滑动事件

摘要：移动端触屏滑动的效果其实就是图片轮播，在PC的页面上很好实现，绑定click和mouseover等事件来完成。但是在移动设备上，要实现这种轮播的效果，就需要用到核心的touch事件。处理touch事件能跟踪到屏幕滑动的每根手指。以下是四种touch事件touchstart: //手指放到屏幕上时触... 阅读全文

posted @ 2015-04-21 17:31 雨为我停阅读(298) 评论(0) 推荐(0) 编辑

调试WEB APP多设备浏览器(转)

摘要：方法：adobe shadow \ opera远程调试\ weinreadobe shadow:我们经常使用Firefox的firebug或者Chrome的开发人员工具进行Web调试页面，JavaScript，DOM元素和CSS样式的调试。但是，当我们为移动Web站点或应用进行调试时，这些工具就很不... 阅读全文

posted @ 2015-04-21 17:29 雨为我停阅读(205) 评论(0) 推荐(0) 编辑

html5用到的js

摘要：1、Zepto.js 是专门为现代智能手机浏览器退出的 Javascript 框架, 拥有和jQuery相似的语法, 但是和jQuery相比下来, 他有很多优点, 大小方面 , 压缩后的 zepto.min.js 大小只有21K, 使用服务器端 gzip 压缩后大小只有5~10K, 可以说非常的小,... 阅读全文

posted @ 2015-04-21 17:27 雨为我停阅读(271) 评论(0) 推荐(0) 编辑

html5极速3D立体式图片相册切换效果

摘要：下载Demo 阅读全文

posted @ 2015-04-01 17:44 雨为我停阅读(450) 评论(0) 推荐(0) 编辑

鼠标悬停css3动画效果

摘要：下载Demo效果预览html: 鼠标悬停css3动画效果 ... 阅读全文

posted @ 2015-04-01 17:28 雨为我停阅读(3068) 评论(0) 推荐(0) 编辑

3D动画

摘要：点击查看Demo：3D动画效果 1 2 3 4 5 6 nextprev 阅读全文

posted @ 2015-01-06 21:32 雨为我停阅读(224) 评论(0) 推荐(0) 编辑

CSS3实现jquery的特效

摘要：实现“慕课网”的图片滑过缩放的效果技术点：css3—— -webkit-transform:scale(1.2);.course-list-img .img_1:hover{ -webkit-transform:scale(0.8,1.2); //宽度缩小80%,高度放大120% ... 阅读全文

posted @ 2014-06-25 15:12 雨为我停阅读(356) 评论(0) 推荐(0) 编辑

css3属性及事例

摘要：在看网上别的前端大牛的作品时，总会有新的收获，我想很多人应该都知道box-shadow，但是不知道有没有接触过这个box-shadow: 2px 2px 4px rgba(0,0,0,0.4) ，现在就来介绍下，其中，rgba是CSS3中的属性，rgba括号中前3个数字代表着 red gree... 阅读全文

posted @ 2014-06-13 14:26 雨为我停阅读(167) 评论(0) 推荐(0) 编辑

HTML5和CSS3的网站

摘要：http://www.html5cn.org/portal.php?mod=list&catid=15 阅读全文

posted @ 2014-06-09 17:04 雨为我停阅读(152) 评论(0) 推荐(0) 编辑

利用@media screen实现网页布局的自适应

摘要：经常为不同分辨率设备或不同窗口大小下布局错位而头疼,可以利用@media screen实现网页布局的自适应,优点:无需插件和手机主题,对移动设备友好,能够适应各种窗口大小只需在CSS中添加@media screen属性,根据浏览器宽度判断并输出不同的长宽值以下是针对自用主题而写的css,对宽度768... 阅读全文

posted @ 2014-06-06 16:14 雨为我停阅读(383) 评论(0) 推荐(0) 编辑

关于web中的自适应布局

摘要：一、”自适应网页设计”的概念2010年，Ethan Marcotte提出了“自适应网页设计”（Responsive Web Design）--这个名词，指可以自动识别屏幕宽度、并做出相应调整的网页设计。二、允许网页宽度自动调整“自适应网页设计”到底是怎么做到的？其实并不难。首先，在网页代码的头部，加... 阅读全文

posted @ 2014-06-06 16:13 雨为我停阅读(1008) 评论(0) 推荐(0) 编辑

HTML5全球普及加速：有望终结iOS与安卓界限【转】

摘要：HTML5或将成为未来移动互联网时代的颠覆者。 5年前，当第一台iPhone诞生时，乔布斯断然拒绝了FlashPlayer，而选择HTML5(新型网页标准)取代Flash的功能。他曾预言，“虽然现阶段原生应用给了用户很好的体验，但基于网页的应用才能代表未来。” 6月28日，Adobe宣布将FlashPlayer全面从Google商店撤出，转攻HTML5；与此同时，由Mozila开发的基于HTML5的智能手机操作系统FirefoxOS也正式发布。有业内人士向记者表示，在技术的迅速变革下，乔布斯的预言有望实现，HTML5将可能成下一代移动互联网的杀手锏。弥合iOS和安卓？近日，由美... 阅读全文

posted @ 2014-04-03 10:11 雨为我停阅读(229) 评论(0) 推荐(0) 编辑

HTML5和CSS3的学习视频

摘要：用Windows8和IE10开发HTML5网页视频教程专辑(Build New World)http://dreamdesign.csrjgzs.com/Article/ShowArticle.asp?/3793-1.html通过视频的方式深入浅出的介绍HTML5和IE10网站开发，让更多人了解HT... 阅读全文

posted @ 2014-04-01 11:43 雨为我停阅读(240) 评论(0) 推荐(0) 编辑

淘宝语音搜索的实现——html5

摘要：作为一个专业的淘宝控，不知道从什么时候开始发现淘宝上居然还有语音搜索，好吧，因为好奇心作祟还是想一探究竟。不过我想仔细一点的人，都会发现在只有在webkit内核的浏览器上有，原因是它只支持webkit内核浏览器。我们先看下他们的不同显示下面是在火狐下的截图下面这个是在chrome下的截图能猜想到的，就是写的代码肯定是不兼容的。不过你会发现真是比较简单的，就算你是前端初学者你也会明白其中参数的意义：属性x-webkit-speech就是让你的输入框的右边出现一个小话筒，有了语音的功能。而lang，则是强制输入框里面的语音的语言种类，例如上面写的lang=... 阅读全文

posted @ 2014-03-14 12:11 雨为我停阅读(1552) 评论(0) 推荐(0) 编辑

随笔分类 - HTML5和CSS3