cssfly: web2.0的网页CSS在线实时编辑工具
CSSfly是一个Web 2.0工具，方便你你的浏览器直接实时编辑你的网站。可以实现简单的CSS代码和html代码的编辑。该工具专为开发者人员而设。用它来开发，测试或检查你的网络设计工程，相对来说还是比较方便的。 你可设置编辑框架的位置为上下左右。 进入CSSfly
阅读更多用CSS实现内容的垂直居中
在设计页面布局的时候，我们很可能需要到一些内容可以达到垂直居中。如果使用 <table>里面的valign属性，那很容易达到内容的垂直居中。但使用<table> 的缺点就是，你很可能就为了达到某些文本的垂直居中，就能弄一个烦人的表格框架。而现在，Verne为我们带为一个解决方法，纯CSS实现页面的垂直居中。 1.html代码 <div id="container"&...
阅读更多CSS实现的标签云(Tag cloud)远视效果
Mike Cherim 由于设计时的一个标签失误，却误生成了一个很具实验性质的标签云远视效果。看一下，是不是很酷？也许下次你在设计你的Tag cloud时，可以尝试着用这种字体从小到大的排序，就好像一个电影院似的。只是这样的设计，似乎更适合静态标签云。或是用Slimp tags进行include，总之，肯定会比普通的生成要麻烦一点。
阅读更多ADxMenu:基于Javascript和CSS的下拉菜单
ADxMenu 是一个由 javascript 和CSS创建的下拉菜单解决方案， 你可以利用它很轻松的为你的网页设计创建出漂亮的下拉菜单效果。 它使用<ul>和<li>标签构成，支持多级子菜单并且提供详细的使用方法，并且含有多种 JavaScript参数配置效果。ADxMenu良好运行于各大主流浏览器， (IE6需要一个专门的Hack),支持横向和纵向菜单，甚至可以控制...
阅读更多5个web2.0风格的CSS菜单创建教程
这篇文章包含了五个Web2.0风格的CSS菜单创建教程，这些CSS菜单的设计灵感都来源于一些些Web 2.0网站，包括使用圆角， scriptaculous和ajax等效果。(注:教程来自Woork，下面的教程你可以需要使用代理才能访问) Digg-like navigation bar using CSS 这篇文章教你如何使用CSS创建一个类似Digg风格的菜单导航栏。 Gettyone-like search options menu wit...
阅读更多37个Ajax和CSS实现的Tab选项卡切换效果界面
原文:37+ Great Ajax, CSS Tab-Based Interfaces 翻译: 帕兰 在过去几年中，Web开发人员开发了许多ajax和CSS，Tab选项卡切换为基础的界面，成为一项非常有趣的技术，它让我们用一种简单的方式获得信息，而不需要打开和关闭多个窗口。 在本文中，我们花了许多时间来为你寻找最好的以Tab选项卡切换为基础的界面应用，这些Tab选项卡切换应用包括使用纯CS...
阅读更多53种网页设计师必备的高级CSS技巧
原文: 53 CSS-Techniques You Couldn’t Live Without 翻计: 帕兰 来自SmashingMagazine的一篇旧文了，不过还是很有用的，帕兰简单翻译一下，并添加一些简短的介绍。 CSS是很重要的，它意味着布局、页面设计和网页信息可以完全的隔离开来，而只需要更改一个CSS样式表文件。在 过去的几年中，许多优秀的Web开发者，为我们创造了很多优秀的CSS技术，在...
阅读更多CSS Type set: 在线字体调整工具
CSS Type set是一款在线字体调整工具。你可以使用它来对字型进行排版调整并实时的看到CSS代码。在下图中，其中，你可以设置文本的字体、大小、颜色、粗体、斜体、下划线、布局等。 这样的工具很简单，但对Web设计者来说，也算是提供了一个方便，省去了每次更换代码然后刷新页面的动作。
阅读更多9个永不过时的CSS 3栏布局技巧
我喜欢3栏布局的网页设计，尽管时下正火的Web2.0似乎很少采用3栏布局。但没关系，我们是非非非主流。 但是3栏布局相对来说就比较复杂，有些难以控制，Noupe发表一篇文章，收集了9个号称永不过时的三栏布局设计技巧(9 Timeless 3 Column Layout Techniques)。现帕兰翻译出来，与你分享。 首先，任何一个布局通常都有headers, navigation bars, content...
阅读更多使用CSS创建Digg样式风格的导航栏或菜单
本教程讲述了如何使用圆角图片设计一个digg样式风格的导航栏。达到下面这样的效果(via woork) 1.创建一个html页面，并把下面的代码复制粘贴到<body>标签内: <div id=“topbar”> <a href=“p1.html”><span>All</span></a> <a href=“p2.html” class=“active...
阅读更多
