快速业务通道

WEBJX收集CSS格式化和造型网页高级教程

作者 佚名技术 来源 CSS技术 浏览 发布时间 2012-02-26

CSS 是现代网页设计的重要基石。Web 标准要求使用 CSS 来格式化和造型网页。其轻量级的特性,大大超越以往诸如表格之类的布局方法。

CSS 并没有想象中的难以捉摸。以下是一些利用 CSS 创建造型设计元素的技巧和技术,也包括一些结合 JavaScript 或 XHTML 以扩展网站功能的案例,适合作为学习 CSS 的基本指南。当然对于经验丰富的设计师,同样值得阅读。

1. 布局和用户界面技术

当前 CSS 主要应用于创建页面布局。利用 CSS 创造页面布局和用户界面,有几乎无限的可能性。下面是一些更有趣的技术。

The simplest way to horizontally and vertically center a DIV
本文介绍用 CSS 方法使 DIV 纵向或横向居中。虽然有很多通过父 DIV 和子 DIV 实现居中的代码,但这个特殊方法仅使用一个 DIV 元素,并且简单得多。

New CSS Sticky Footer - 2009
一个棘手的完全跨浏览器兼容的页脚技术,兼容 Google Chrome 浏览器,并且不需要空 DIV 辅助。

Simple Page Peel Effect with jQuery & CSS
此教程结合 jQuery 和 CSS 创建网页剥离效果。大多数网站都使用 Flash 来实现这种效果。因此如果不热衷于 Flash 技术,这会是一个不错的选择。

Equal height boxes with CSS
一个使用 CSS 创建等高栏式布局的基本实例,彻底抛弃表格布局的代码冗杂与混乱。

Adaptable view - how do they do it?
让用户手动改变网站的表现,似乎可以大大提高网站的易用性和用户粘度。本教程将介绍如何为网站实施和部署浏览器适应技术。

CSS: The All-Expandable Box
一个创建自适应 CSS 容器的教程。容器会自动向各个方向扩大,以适应所包含的内容,而不只是垂直增长。适用于用户可控字号导致使 CSS 容器撑开的情况。

Four Methods to Create Equal Height Columns
一个使用 CSS 创建等高列的教程,共涉及四个不同的技术。兼容所有主流浏览器(甚至 IE6 浏览器)。

Vertical Centering With CSS
这篇文章包括各种使 CSS 元素垂直居中于网页的最佳技术。同时也介绍了如何利用这些技术,创建一个简单小巧的垂直居中的站点。

CSS vertical center using float and clear
使用浮动 (float) 和清除 (clear) 创建垂直居中的 CSS 容器,甚至兼容 IE5 版本。

Cross-Browser Inline-Block
本教程涵盖在多重内容情况下,创建一个内联块 (inline-block) 布局的方法,而不打破布局的完整性。

The CSS “Ah-ha!” Moment
谈论大多数设计师,在其职业生涯的某个时候发出 "Ah-Ha!" 感叹的

凌众科技专业提供服务器租用、服务器托管、企业邮局、虚拟主机等服务,公司网站:http://www.lingzhong.cn 为了给广大客户了解更多的技术信息,本技术文章收集来源于网络,凌众科技尊重文章作者的版权,如果有涉及你的版权有必要删除你的文章,请和我们联系。以上信息与文章正文是不可分割的一部分,如果您要转载本文章,请保留以上信息,谢谢!

分享到: 更多

Copyright ©1999-2011 厦门凌众科技有限公司 厦门优通互联科技开发有限公司 All rights reserved

地址(ADD):厦门软件园二期望海路63号701E(东南融通旁) 邮编(ZIP):361008

电话:0592-5908028 传真:0592-5908039 咨询信箱:web@lingzhong.cn 咨询OICQ:173723134

《中华人民共和国增值电信业务经营许可证》闽B2-20100024  ICP备案:闽ICP备05037997号