前面我在《13个CSS技巧》和《7个不能遗忘的CSS样式》收集了一些实用的CSS技巧，主要是用来处理一些CSS的样式。今天在这篇教程，我依旧收集和整理了一些CSS技巧，其中有一些技巧大家可能已经使用过了，有些可能大家在实际项目中并碰到，另外有一些技巧我也在以前的教程中有单独提出来并做了详细的解说，今天主要是把他们放在一起，方便大家的查阅和学习。这些CSS技巧能帮大家解决一些恼人的问题，从而也能帮大家提高自己CSS方面的技术。别的先不说了，我们一起开始吧。

一、跨浏览器的兼容

浏览器的兼容问题，大家都有碰到过了。兼容问题对于新手来说都是一件棘手的事情。下面的一些hack写法，可能帮你解决浏览器的特定问题。

今天这个教程中主要和大家一起来探讨和学习：如何使用CSS来制作图形，比如说圆形，半圆形，三角形等。前面有几个教程中都有使用了纯CSS使用border来制作三角形，今天我特意在网上查阅了一下，介绍这样的教程还是蛮多的，因此我也决定整理一份相关教程出来与大家一起分享。最早发现使用border制作三角形是人物Eric Meyer的发现的，但我没有找到Eric Meyer介绍的教程，可相关教程就很多，我在此就不列出来了，我们开始今天的学习之旅吧。

如何工作？

很少会有人意识到，当浏览器绘制的border，会有一个角度的问题。我们就是得用这样的一个技巧来制作三角的效果。我们只需要保证一边的边框是有色，其他边框色为透明色，这样我们就很容易制作出三角形，然后改变其大小来实现不同的效果。我们一起来看一段代码：

大家说CSS很简单，三下五除二就能把CSS拿下，初学时，我也是这么认为的，也是这样给我很大的信心从事这一行，但后面随着相关知识面的提高，我越来越感觉CSS是蛮深的东西，而且越来越觉得自己掌握的CSS还是很薄弱。从而决心要先把CSS这座山头攻下来。大家平时在Web制作中碰到CSS的问题，总会觉得烦人，其实我个人认为最好的解决方案往往都是最简单的。今天在这篇教程中要和大家一起分享CSS的几种小技巧。

今天要给大家介绍七个CSS样式片段，我认为这几个片段对我们项目的制作帮助还是蛮大的，如果你认真看完这篇教程后，我想你会喜欢这几个CSS样式，而且我相信你会马上运用到你即将要制作的下一个项目中，或者说会马上运用到你现在制作的项目中。在具体介绍之前先要告诉大家，这个几CSS样式片段是David Walsh从Paul Irish的HTML5 Boilerplate项目中挖掘出来的。

Tabs的效果在Web页面制作中，可以说是随处可见，我也知道有关于这样的教程在网上上相当的多，前面本站在《纯CSS3制作Tabs选项卡》中介绍了纯CSS制作的Tabs，而《CSS3+jQuery制作切角的Tabs》介绍了使用CSS3+jQuery制作Tabs的方法。今天依然要介绍的是使用jQuery来制作Tabs，但这种方法相对来说是简单易于理解的，就算我这样的初学者都能理解。

在Web页面开发中，自从有了<div>的出现，大家就在讨论table。就出现了什么时候？如何使用div，什么时候？如何使用table的争论。虽然争论不少，但最后得出的结论是一致的：当你需要在页面中处理与数据时，table是首选之一。

在CSS2中，我们为了达到一定的设计效果，时常都需要添加额外的<div>或使用PNG图片等方法来实现。当CSS3的时代到来之际，我们不应该只局限于这些老技术，我们应该大胆的去尝试一些新技术。今天我们就跟随Ｎettuts的Vasili的教程《11 Classic CSS Techniques Made Simple with CSS3 》。来学习使用CSS3新技术实现十一种经典的CSS样式效果。

学习jQuery有一段时间了，进展甚慢。这段时间反复在学习手风琴的制作，从纯CSS的制作到jQuery的制作，在W3cplus和大家共享了多篇有关于制作手风琴效果的Blog。比如：

在《jQuery和CSS3给图片制作圆角》一文中说过了，当你在Web页面制作中如果你直接把CSS3中的border-radius和box-shadow应用在图片，浏览器并不会完全显示。前面在《jQuery和CSS3给图片制作圆角》中说过其解决方法，就是把图片作为背景图片，这样我们就可以应用任何样式来修饰图片，而且此时浏览器也会完美的呈现出来。

前一回我在《CSS3制作垂直手风琴》介绍了使用“:hover”来制作手风琴效果。今天，你将学习使用CSS3的另一个属性——:target来制作一个非常简单的动画手风琴的效果。在具体动手之前，我们一起来简单的了解一下这个“:target”。