webkit webApp 开发技术要点总结如果你是一名前端er,又想在移动设备上开发出自己的应用,那怎么实现呢?幸好,webkit内核的浏览器能帮助我们完成这一切。接触 webkit webApp的开发已经有一段时间了,现把一些技巧分享给大家 :1. viewport: 也就是可视区域。对于桌面浏... Read More
posted @ 2014-12-08 12:03 漂在前端 Views(119) Comments(0) Diggs(0) Edit
1、首先我们来看看webkit内核中的一些私有的meta标签,这些meta标签在开发webapp时起到非常重要的作用第一个meta标签表示:强制让文档的宽度与设备的宽度保持1:1,并且文档最大的宽度比例是1.0,且不允许用户点击屏幕放大浏览;第二个meta标签是iphone设备中的safari私有m... Read More
posted @ 2014-10-28 18:02 漂在前端 Views(201) Comments(0) Diggs(0) Edit
ps:每过一段时间就会发觉自己懂的越来越少,打开编辑器的时候不知道从何入手。兴许是过于急于求成,总没有系统地去对这门语言进行学习,囫囵吞枣,只想着能够解决工作需求。是时候让自己重新出发,从零开始,一页一页地把书看完,不浮躁,不安逸转自:http://kb.cnblogs.com/page/19178... Read More
posted @ 2014-10-09 14:53 漂在前端 Views(138) Comments(0) Diggs(0) Edit
js中用cssText设置css样式(2012-08-21 10:40:22)转载▼标签:js如果网页中一个 id为“no”的标签,暂且当div标签来tell;想要在js中设置这个div的css样式,很一般的做法是:var obj = document.getElementByIdx_x_x('no... Read More
posted @ 2014-08-21 10:55 漂在前端 Views(375) Comments(0) Diggs(0) Edit
CSS3圆角属性在Firefox,Chrome,Safari的实现目前我们已经可以在Firefox,Chrome,Safari实现这个功能了,但他们也还是使用私有属性来实现,用法上略有区别。先说一下Firefox的圆角属性:-moz-border-radius: {1,4} | inherit如果你想设置四个角都是一样圆角的话,可以像这样子直接设置-moz-border-radius:5px;也可以单独设置元素的上左、上右、下右、下左四个角的值,分别用-moz-border-radius-topleft、-moz-border-radius-topright、-moz-border-radiu Read More
posted @ 2011-09-28 17:29 漂在前端 Views(592) Comments(1) Diggs(0) Edit
上一篇文章介绍了css3的渐变色属性,今天带来CSS3渐变特性的应用。可以去看一组按钮,我只用了 CSS创建完成的渐变按钮(不需要图片和Javascript)。 这些按钮可以根据字体的大小伸缩。当填充和字体大小发生变化时,这些按钮的大小可以容易地适应。 这种方法最好的部分就是能被应用于任何HTML元素,比如 div, span, p, a, button, input, 等等。为什么这些按钮如此的酷?纯 CSS: 没有图片和Javascript的应用。渐变可以跨浏览器应用 (IE, Firefox 3.6, Chrome, and Safari).灵活和可扩展: 通过改变字体大小和填充值,按钮 Read More
posted @ 2011-09-28 17:28 漂在前端 Views(2598) Comments(0) Diggs(0) Edit
CSS的渐变特征介绍了WebKit的约两年前,但由于很少使用与大多数布尔斯互不兼容。但现在的Firefox 3.6 +,支持渐变,我们可以创造风格,而不必创建一个图像渐变。这个职位将告诉你如何为CSS代码渐变要由主要浏览器:IE浏览器,火狐3.6 +,Safari和Chrome的支持。此外,还有我的下拉菜单(demo)使用CSS渐变。对于WebKit的浏览器下面的代码top (#ccc) to bottom (#000).它会显示一个线性渐变如Safari,Chrome等WebKit的浏览器background: -webkit-gradient(linear, left top, left Read More
posted @ 2011-09-28 17:26 漂在前端 Views(549) Comments(0) Diggs(0) Edit
Web技术的发展速度太快了,如果你不与时俱进,就会被淘汰。因此,为了应对即将到来的HTML5,本文总结了22个HTML5的初级技巧,希望能对你进一步学习好HTML5会有所帮助。1. 新的Doctype声明XHTML的声明太长了,我相信很少会有前端开发人员能手写出这个Doctype声明。view sourceprint?1<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" 2"http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd& Read More
posted @ 2011-08-02 16:49 漂在前端 Views(163) Comments(1) Diggs(0) Edit
ext-stroke(文本描边)和text-fill-color(文本填充色)注意点:目前这两个属性只有webkit内核的Safari和Chrome支持,例如: -webkit-text-stroke: 3.3px #2A75BF;text-fill-color:颜色值,和color属性差不多都是文字的样式;同时使用text-fill-color和color属性,text-fill-color将覆盖color属性的颜色值;text-fill-color可以使用透明值,即:text-fill-color:transparent查看一个text-stroke(文本描边)和text-fill-col Read More
posted @ 2011-08-02 16:35 漂在前端 Views(438) Comments(0) Diggs(0) Edit
CSS3下的渐变文字效果实现background-clip + text-fill-color下的实现如果您手头上的浏览器是Chrome或是Safari,则您可以在demo页面中看到类似下面的效果:<h2 class="text-gradient">天赐美妞</h2>CSS(CSS代码中关键有用的其实就是最后三行):.text-gradient { display: inline-block; color: green; font-size: 10em; ont-family: ´微软雅黑´; background-image: Read More
posted @ 2011-08-02 16:30 漂在前端 Views(393) Comments(0) Diggs(0) Edit