轩枫阁

首页 / Web前端 / CSS (第3页)

多说头像CSS样式自定义-让评论更炫酷

前言

所谓的社会化评论,即网站的评论系统集成“QQ、QQ空间、新浪微博,人人网、豆瓣”等社交账号及第三方平台的单点登录功能,实时评论同步,实名制留言将大大提高评论的质量和传播效率。通过插件安装、插入代码等方式使用社会化评论。如今wordpress、DedeCMS、DISCUZ等众多博客均可使用。

现今的社会化评论系统,主要有:友言多说畅言灯鹭

轩枫阁从13年3月上线时,一直使用多说,只因其UI及体验吸引住了我。使用灰色背景,完美搭配多说自带主题,无需自定义CSS。但是最近发现多说的自定义CSS功能结合CSS3可以做一些炫酷的效果,主要是针对头像。

关于多说

多说是一款追求极致体验的社会化评论框,可以用微博、QQ、人人、豆瓣等帐号登录并评论。多说帮助用户搭建更活跃,更互动的评论平台,功能强大且永久免费。它正在改变网站与用户之间,用户与用户之间的互动方式。这个专门基于社交网络的评论系统,能够轻松的帮网站主搭建自己互动性极强的社区,让留言的用户都有“家”的感觉。

效果图

查看全文

2014/08 30  周六

CSS3黑白滤镜grayscale的应用

前言

CSS3 Filter与我们所熟悉的CSS Filter是完全不同的两个概念,也不是所谓的IE滤镜,它是指通过CSS或SVG渲染元素概念可以描述的元素,包括子元素。

语法

语法很简单,grayscale的参数中100%表示黑白色调,0%表示彩色。

demo

链接

http://xuanfengge.com/demo/201408/gray/ 查看全文

2014/08 17  周日

CSS3实现晃动的引导箭头-百度新首页

前言

最近百度再次升级新首页,UI大赞,连新首页的介绍页也显得高大上,使用单页滑动OnePage效果。如果你使用账号登陆百度首页,会陆续收到升级的通知。然后在引导页,发现了一个用户体验上的创意,就是结合CSS3实现晃动的引导箭头。

Demo

预览http://xuanfengge.com/demo/201406/guide/

效果图

css3 查看全文

2014/06 07  周六

关闭WordPress自动加载的Open Sans字体-WP访问过慢原因

序言

wordpress大概从wp-3.8开始会自动加载Open Sans字体,并引用Google上面的CSS样式。而最近谷歌经常打不开,导致网站访问速度过慢,严重的会拖慢几十秒。Open Sans字体主要用于WP站点管理员登陆后顶部功能条的字体样式,而对于国内用户来说,Google会出现经常打不开或者访问速度过慢的情况,所以会拖延站点的打开速度。当然,如果没有登录后台直接访问站点,不会出现加载字体的问题。 通过观察代码可以看到,WP是这样加载字体的,在script-loader.php(wordpress3.9版本,wp-includes目录下)的580行代码进行加载。

那该怎么去掉呢?方法主要有4个:插件过滤、functions.php过滤、一键替换程序代码、GoAgent翻墙

一、插件过滤

简介

为此有专门的插件来去除字体加载。此方法在前台和后台均有效。

1. 插件一

名称:Remove Open Sans font Link from WP core

地址http://wordpress.org/plugins/remove-open-sans-font-from-wp-core/

简介:移除WP核心的谷歌字体链接.。 Installs ‘Remove Open Sans font Link from WP core’ plugin on your wordpress blog, so it will doesn’t load Open Sans font from Google fonts.

2. 插件二

名称:Disable Google Fonts

地址http://wordpress.org/plugins/disable-google-fonts/

简介:另一个类似的插件

二、functions.php过滤

简介

在主题中的functions.php文件末尾加上一下代码之一即可。此方法仅在前台有效,在后台界面无效,因为仅修改主题代码。

1. 代码一

查看全文

2014/06 01  周日

谷歌3D魔方涂鸦揭秘-Google Doodle Rubik’s Cube

前言

5月19日,为了纪念魔方发明40周年,Google在首页发布了有史以来最酷的涂鸦:一个3D互动魔方。

关于魔方(Magic Cube)

魔方(Magic Cube),又称为鲁比克方块,由匈牙利布达佩斯建筑学院厄尔诺·鲁比克教授于1974年发明。魔方最初仅仅是一种帮助学生增强空间思维能力的教学工具,但随后却发展成风靡世界的益智玩具。

体验一把

史上最酷的web 3D魔方,看看你是否有能力通关呢?

官网版:https://www.google.com/logos/2014/rubiks/rubiks.html

备份版:http://xuanfengge.com/demo/201405/magic-cube/

Screen-Shot-2014-05-19-at-09.34.22

开发历程

3D魔方也是Google公司处理过的最有难度的涂鸦,魔方的成功要归功于CSS技术的进步和Google工程师们的聪明点子。制作这个拥有5.19X10^20种组合的魔方互动程序共耗去Google公司2个月的时间。 查看全文

2014/05 29  周四

纸飞机许愿

x

钢琴节奏

请选择弹奏的曲谱

    • 1
    • 2
    • 3
    • 4
    • 5
    • 6
    • 7
    • 1
    • 2

    [返回曲谱列表]

    点击开始录制,可以录制弹奏的曲子