·网页特效库   ·网页工具库      
网页特效库
   
背景按钮导航特效图片特效文本特效时间特效状态特效另类特效网页制作网站首页
 
< 后退    |    收藏网页特效库
 推荐网页特效 更多推荐特效
 购物网站的导航效果,推荐!
 向上下左右滚动图片的特效
 超级变态广告代码
 设为首页
  加入收藏夹
 防止选择和复制
 新浪博客的提示窗口,推荐!
网页工具库 - 让网页制作更轻松
 推荐网页工具 更多网页工具
 在线html编辑器
 在线CSS编辑器
 滚动条颜色生成器
 弹出窗口生成器
 网页加密解密工具
 汉字转换成拼音工具
 文本繁简体转换工具
您的位置:网页特效库 >>  网页制作 >>  认识学习CSS中的滑动门技术 打印友好页面
认识学习CSS中的滑动门技术
作者:未知   出处:网络转载

在CSS中,一个经常被人们讨论的先进之处即背景图像的可层叠性,并允许他们在彼此之上进行滑动,以创造一些特殊的效果。根据CSS2.0当前的规定,每一个背景图像都需要各自的HTML元素。在许多情况下,典型的标记已经为一般的接口组件提供了多种元素以供我们使用。 

在CSS中,一个经常被人们讨论的先进之处即背景图像的可层叠性,并允许他们在彼此之上进行滑动,以创造一些特殊的效果。根据CSS2.0当前的规定,每一个背景图像都需要各自的HTML元素。在许多情况下,典型的标记已经为一般的接口组件提供了多种元素以供我们使用。

标签导航栏就是其中的一个例子。过去,我们频繁的使用这些标签,并已成为了一种非常流行的站点导航方式。现今,在CSS已被广泛支持的前景下,我们可以为我们站点制作出更高质量和更好外观的标签导航栏来。你也许知道CSS可以用来“驯服”无序的列表,或许你还曾经看到过这种样式的标签列表:

 

如果我们想用和以上类似的标记,将导航标签变成这种样式,该怎么办呢?

经过简单的设计,我们是可以做到的。

创新于何处?

我见过的许多基于CSS的导航标签大都具有一类的特征:矩形的色块,也许仅仅是一个轮廓,对于当前选中的标签则没有边框,标签在鼠标指针游至其上时改变颜色。这难道就是CSS所能给我们的全部吗?一连串的小盒子和单调的色彩吗?

在CSS被广泛采用之前,我们已经看到许多标签导航设计中的创新之处。独创的外形,熟练的色彩混合,以及对真实世界中许多物理接口的模仿。但是这些设计往往过分依赖于经过复杂制作、带有文本的图像,或被包装成若干嵌套的表格。修改文本或改变标签的顺序则需要一个复杂的过程。文本的伸缩更是不可能的,或给页面的布局极大的影响。

纯文本的导航栏比起文本即图像的导航栏更具有持续使用性和更快的载入速度。同样,我们甚至可以为每一个图像加上alt属性,对于弱视者,纯文本更可以自由的改变大小。不足为奇的是,基于纯文本的导航栏,并加以CSS样式,又重新回到Web设计中来。但是,大多数基于CSS的导航栏设计,至今为止仍然是毫无意义的。一种最近被采用的技术(例如CSS)可以让我们做的更好,同样不失先前提到的那些表格和图片标签的效果。

上一页   1   |   2   |   3   |   4   下一页
 上一篇:设计师谈网页设计思维 返回列表  下一篇:天天体验
网页工具库 - 让网页制作更轻松
 
网页特效库 关于我们 | 联系本站 | 免责声明 | 版权声明 | 网站地图 | 友情链接 | 鄂ICP备05023174号
Copyright © 2008 www.butong.net.All Rights Reserved.