继续关于Drupal主题设计的讨论，讲一讲Drupal的Header部分的三个元素（Logo, Site-Name 和Site-Slogan）的摆放。如果你对CSS不是很熟悉，希望这对你有所帮助；如果你是CSS的高手，希望你能提出改进的意见：）
通常，我们会需要Logo, Site-Name 和 Site-Slogan 按照左图的结构摆放：把Logo放在最左边，然后Site-Name与Site-Slogan并列。在过去，这个通常使用table来实现，只要定义一个类似形状的table，把元素放进去就可以了，但是根据现在网站设计的标准，我们需要使用CSS来控制完成。首先需要将Logo图片放在左边，这个可以通过以下CSS定义实现：
.logo { display:inline; float:left}
当然你还可以放入其他的定义，譬如logo图片的长宽定义，以及border属性等等。对于SITE-NAME与SITE-SLOGAN，按照如下定义即可：
.site-name {position: abosolute; top: 20px}
.site-slogan {position:absolute; top: 50px}
通过绝对位置来控制site-name与site-slogan的显示，top 定义的px的多少可以根据你的具体主题来调整，另外在使用中，你还需要用 font-size 来定义它们的字体的大小。这样就完成了，Header部分三个元素的设置，其实很简单的。
同时Foundation Theme也为我们提供了模板文件的构造，可以按照它方便更改其他的模版文件，譬如我在 http://www.dogbreedsweb.com 使用的模版，默认是不显示logo的，参照Foundation Theme，可以很方便的加入Logo显示的支持，只需要加入插入 $logo 的那段语法即可。下图是一个按照上述方法完成的Header部分的示例：
以及相关的CSS定义：
.site-name {position:absolute;top:15px;padding-left: 15px;display:inline;font-size: 2em;}
.site-slogan {position:absolute;top:55px;padding-left:15px;display:inline;font-size:1.2em;}
.site-logo{margin:0;display:inline;float:left;}