对于大部分人而言，利用css设计一个网站风格是十分简单的事情。只要语义上你已经标记你的HTML，并且以合法方式设计了div元素和类，那么你的设计过程将是十分轻松愉悦的。然而，css还有很多强大的功能被设计人员忽视，而且我们大多数人是主观意识上回避了这些复杂的css性能。原因在于这些功能不是那么的直观，需要较多的注释来让我们理解他们是如何运作的。下面我将介绍5个边角难于处理的css属性，同时教会你们如何轻松驾驭他们。
CLEAR
首先我们假设你正在建立一个网站并且正在用css设计美化他。你建了一个container div，采用了浮动功能，并且你同时拥有两个div – 一个用于你的文章主题内容一个用于你的工具条。但是当你完工后你会发现你的container并没有完全的覆盖你设计的两个div元素下面，而是仅仅包含了这两个div元素。他完工的状态就像所有元素随意堆砌起来，看上去就是那么怪异，这里是HTML代码
在这我们设计了一个所有内容都建立在定宽的container并且主主体内容只能在这个container内滚动。我们建立了一个主体内容区域和两个工具条区域。他们都定义为靠左浮动，所以他们是处在同一行的。那么我们就会在下方产生一个页脚。现在我们来查看一下用这些div后，你所期待生成的 css的外观
显然上面的这个结果不是你想要的。主文章的专栏比共工具条栏长了不少，而且container div将页脚挤到了可用空白，而并未延展至所有文章涵盖的区域。对于这些问题我们只需一行简单的css代码就可以搞定，而且你压根不会相信这行代码有多么简单。在页脚，你可以敲入下面这行css代码这就是那行代码！
现在你的container div可以将H2两个标题涵盖进去了。在这行代码输入后，在同一行，你的网页可以显示文章的div和你需要的两个siderbar div。在这行下面将是页脚div元素，由于页脚div并未设置背景，所以他显示出来的将是container div的蓝颜色。经过这样处理后，container div 布满整个页面下层，并将你的文章包围起来。
我都没想通为什么这个功能会给设计者带来这么多困扰。一旦你将他的工作机理分解开来，那么这个功能将会显的无比简单。首先我们从最经的例子中抽取一些HTML和css的样本。这次，我将在content div中创建一个内部窗口让他看起来像是嵌入式。下面这些代码会产生一个红色嵌入阴影。
我对这些代码做了微小改动。现在工具条的宽都是95像素的，我在padding属性中添加5像素，这样以来该样式在边界处将是错误的。
一定要记住添加第三方前缀，这样你制作的效果才能在多数浏览器中得到支持。我们拆解css后，你会发现工作机理是比较简单的。Inset中的第一个值是告诉浏览器将阴影嵌入box中。如果没有这个声明的话，浏览器将会把阴影默认的放置在外部。设置该属性时，前两个像素设置的是这个阴影的水平和垂直放置的位置。将这个两个值都设置为0的话阴影四周边距将会相等。这两个像素如果是正值的话阴影将向右或者向下移动，负值的话阴影将会向左边或者上方。
这属性设置的第三个值决定了阴影的模糊直径，这样阴影看上去将会有个柔和的外观。第四个值是阴影的延展，这个值使得阴影更加，并且让这个阴影更加明显。你可以使用RGBA或者hex的值来决定你阴影的颜色。RGABA替换hex的代码可能与下面这个有点类似
