Home » CSS/HTML

Firefox 将支持 css calc() 属性

Firefox 将在新版本中添加对 css 中 calc() 的支持。目前暂时还没有浏览器支持该功能。
下面简要介绍下 calc() 的用法。顾名思义,calc() 既是计算的意思。例如:

/*
 * 两个并排的 div, 相距 1em。
 */
#a, #b {
    float:left;
}
#a {
    width:75%;
    margin-right: 1em;
}
#b {
    width: -moz-calc(25% - 1em);
}

Click to continue…

2010.06 12

14个国内收藏分享文章代码

现在的网摘站很多,而且提供收藏/分享功能的社交网站也很多。所以在文章页面放上一些收藏/分享到这些网站的按钮很流行。

比如我的博客:

shares

像国外就有专门提供这种服务的网站,只要引入一个 js 就拥有收藏到各个网站的功能。其中最著名的是 AddThis,它支持的网站多得有点吓人。而国内也有类似的网站,比如 bShare,也支持了很多国内的网站。

但无论是 AddThis 还是 bShare 都需要引入一个外部 js 文件。如果你不愿意,也可以自己添加这些代码。

下面就列出了一些国内常见的网摘站(或者是提供收藏/分享的网站)的添加代码以及帮助页面。

首先简单介绍下,这些代码其实就是一个链接,通过在url附加参数的形式来实现的。这些参数一般有 url、标题,有的还有摘要等,而有的仅需要 url。
这些代码就是下面的”添加URL”,里面的 “[url]” 和 “[link]” 分别表示 url 和标题,只要将其替换掉即可。注意,这些参数都必须是经过 url 编码的,如果是 php 可以用 urlencode() 函数进行处理,js 则是 encodeURIComponent() 函数。

Click to continue…

2010.04 29

30个滚动页面示例

以前我们使用 Flash 来制作一些按钮、画廊等,现在通过 jQuery, Mootools, Scriptallicious, Prototype 等 JavaScript 框架我们几乎可以达到同样的效果。这给设计师和开发人员提供了发挥想象的空间。
但如何恰到好处地使用它,让它不至于分散用户的注意力,从而提升网站的价值。
下面30个使用了 JavaScript 滑动效果的网站或许能给你一些参考。

1.Charlie Gentle

Charlie Gentle
Click to continue…

2009.08 26

CSS Hack 总结

浏览器越来越多,不同的浏览器,不同的版本在页面的渲染上都各不相同。这让网页开发人员很头疼,为了能兼容各个浏览器,人们挖掘出了很多 CSS Hack。下面进行一下总结,如果还有其他的 CSS Hack 欢迎提供。

一) 针对 IE 的 Hack

大部分 CSS Hack 都是针对 IE 的,这是用于我们的 IE “坚强”所致,尤其是 IE6。

#test {
    color:red; /*所有浏览器*/
    +color:blue; /*所有 IE */
    _color:green; /*IE 6及以下*/
    _color /**/:pink; /*IE 5*/
}

Click to continue…

2009.06 18

如何去掉链接的虚线框

当一个链接得到焦点时,默认会有个虚线框。如图:

链接虚线框

在 Firefox 里可以用 -moz-outline:none; 或者 outline:none; 来将其去掉。所以我们可以这样写:

a:focus {
    outline:none;
    -moz-outline:none;
}

Click to continue…

2009.06 18
Page 1 of 212

Recent Comments

  • HHTecShare

    HHTecShare

    @HHTecShar»

  • HHTecShare

    HHTecShare

    其实,把元素换成就不»

  • justjavac

    justjavac

    »

  • CSSBaby

    CSSBaby

    @文行天下 谢»

  • 文行天下

    文行天下

    这个网站的主题真不错»