软件工程

本类阅读TOP10
·PHP4 + MYSQL + APACHE 在 WIN 系统下的安装、配置
·Linux 入门常用命令(1)
·Linux 入门常用命令(2)
·使用 DCPROMO/FORCEREMOVAL 命令强制将 Active Directory 域控制器降级
·DirectShow学习(八)： CBaseRender类及相应Pin类的源代码分析
·基于ICE方式SIP信令穿透Symmetric NAT技术研究
·Windows 2003网络负载均衡的实现
·一网打尽Win十四种系统故障解决方法
·数百种 Windows 软件的免费替代品列表
·收藏---行百里半九十

→ 分类导航
VC语言Delphi
VB语言ASP
PerlJava
Script数据库
其他语言游戏开发
文件格式网站制作
软件工程.NET开发
直接用CSS+XML排版

作者：未知 来源：月光软件站 加入时间：2005-5-13　月光软件站
这篇文章可以看作是上一篇《谈一下XHTML网页制作》的内容为核心的界面与版式分离观点继续，也可以当作只是奇巧淫技的一种展示。

P.S：如果想跟着一起做，请先安装Firefox（以下简称FF）浏览器，因为IE对CSS的标准支持不够完善。

XML文档，我们采用RSS的格式，这样大家也比较熟悉，你可以任意找一个RSS文件来做这个练习：）

首先，在你的RSS文件里加入

<?xml-stylesheet type="text/css" href="style.css"?>


如下图所示：
此主题相关图片


在FF中显示效果如下：
此主题相关图片


非常的杂乱无章，好了，我们先写下一句CSS，让他们都区分开来：

*{
    display:block;
}

效果：
此主题相关图片


好了，接下来在Faridea RSS那个位置我们想换成我们的LOGO，写下如下CSS：

channel >title:before{
    content:url("images/logo.gif");
}


此主题相关图片


你现在肯定开始为LOGO后面多余的Faridea RSS头疼了吧，怎么去掉他？把他的颜色改的和背景一样就是了：），抱歉使用这种奇巧淫技

好了，接下来，我们按照设计图加上背景色，设置字体，把不想显示的资料none掉，加入类似如下代码，放心全部的代码我会打在附件中。

channel{
    background-color:#D9C4A6;
    font-size:9pt;
}
channel >title{
    color:white;
    width:777px;
    margin-left:auto; margin-right:auto;
    /*background-color:white;*/
    background:#FFFFFF url(images/top_bg.gif) top no-repeat;
    padding:20px 0px 0px 0px;
}
channel >generator{
    display:none;
}


最后效果如图：
此主题相关图片


好了，最后还是那句话，网站无论设计还是制作，都要以内容为核心。内容无论用HTML标签包围还是被XHTML包围、还是XML包围，这些都不重要，关键是合理的组织好他们，然后拿起CSS这个强大的武器去美化她：）

End


全部代码下载：
此主题相关文件 155247.zip

相关文章：

相关软件：