首页| 版块| 我的| 发帖| 消息
主题:2014年1月31日:修改论坛首页版块名称大小及悬停样式 [电脑版]
为你守候发表于 2014-01-31 21:04
今天在测试一款论坛风格时,感觉没什么亮点,但有一个意外的发现是在论坛首页版块名称在鼠标悬停时会移动!是不是很新奇?!于是分析对比论坛css样式文件,终于有所发现,原来是transition的功劳,又通过搜索了解了一下它的用法。然而,这个样式有些不同,资料上说:“Internet Explorer 10、Firefox、Opera 和 Chrome 支持 transition 属性。Safari 支持替代的 -webkit-transition 属性。注释:Internet Explorer 9 以及更早版本的浏览器不支持 transition 属性。”不过,在我的360极速上显示正常,也正是因为此,才决定研究下。

下面是修改中与现在的对比图(左边的截图于版块图标替换、版块简介修改后):

注意看椭圆圈住部分。左边是原来的版块名称大小,真的不是很明显的样子(马上3年了,今天才注意到这个问题);右边是修改后的样子,字号加大(新增font-size:14px;),还有一个细节是加了下划线,并且右移了(有一个变化的过程。另外,莘祺网的绝大部分版块名称都加了颜色,在没有加颜色的版块名称上悬停时还会加颜色的哦)。在这个修改的过程中,因为版块名称的加大,为了适应,所以重新调整了版块图标的大小由原来的50*50到54*54,而且是一个一个的调整。刚刚看了下,47个(在用的和没有使用的)。而由于版块图标的加大,“综合信息◇共同关注”、“会员报到◇风采展示”、“公司动态◇企业文化”这3个版块的版块简介因为已经达到2行所能显示的最大字数,所以变成了3行,自然又需要重新调整版块简介。

虽然前后花了不少时间,但收获还是很大的——尽管技术含量并不高:版块名称加大;版块图标和版块简介(3个)重新调整;最好玩的是鼠标悬停时版块名称会动,这个真的比较有意思,只是不知道这个样式能在多少浏览器上展示出来?反正,在我的360极速上正常。

浏览大图
回帖(95):
95楼:跨越10年的回复,呵呵。时光真的不饶人。(zhangjingyu)
94楼:“zhangjingyu 更新音乐版和电台版的数据文件,因为里面有些歌曲和电台不能播放了。&# ..(zhangjingyu)
93楼:手机测试修改成功,睡觉去。(zhangjingyu)

全部回帖(95)» | 最新回帖
收藏本主题 | 发表新主题