HTML表格使用从入门到精通(1)

2005-09-22 10:34:57 ezIT/夏治 　 【大 中 小】

    如果你是一名网页设计人员，如果你的网页里没有一个表格，那可以说算不上一个网页（当然全FLASH作品除外），表格的重要性就可想而知。帮助我们控制网页布局、控制内容的显示等等。使用表格有很多的技巧，你可否知道呢？　　
    
    使用表格排版网页
    
    使用表格排版网页，可以使你的网页更美观，条理更清晰，更易于维护和更新。（将表格的宽设为100%，可以使网页的兼容性更好）　　
    
    要尽量细化表格
    
    不要把整个网页放在一个大的表格里，因为一个大表格里的内容要全部加载完才会显示，如果整个网页放在一个表格里，那么你的网页就只会两种情况：　　
    
    1、全部不显示
    
    2、全部显示出来　　
    
    所以建议大家将整个页面分成几块，例如通用的上（放置Logo、Banner、Menu等等）、中（放置页面内容）、下（放置版权信息等等），将每一部分由单独的表格来实现，这样会好一些。　　
    
    表格设计实例
    
    创建一个表格，边框大小设为0（border=0），间距设为1（cellspacing="1"），背景色设为深色（bgcolor="#000000"），全部选定单无格，并将单无格的背景色设为浅色（如:bgcolor="#FFFFFF"），这样可以得到一个细线边框的表格，请看下面的例子：　　
    
    〈table width="50%" border="0" cellspacing="1" bgcolor="#000000"＞
    
    ＜tr bgcolor="#FFFFFF"＞
    
    ＜td＞ ＜/td＞
    
    ＜td＞ ＜/td＞
    
    ＜/tr＞
    
    ＜tr bgcolor="#FFFFFF"＞
    
    ＜td＞ ＜/td＞
    
    ＜td＞ ＜/td＞
    
    ＜/tr＞
    
    ＜/table〉　　
    
    动态改变表格单元格的颜色
    
    在单元格＜td＞标记中加入以下代码，会动态改变单元格的颜色设置：
    
    onMouseOut=”this. bgColor=’’” onMouseOver=”this.bgColor=’’”　　
    
    在行标签＜tr＞标记中加入上面代码，会动态改变一行的颜色设置。　　
    
    〈table width="50%" border="0" cellspacing="1" bgcolor="#000000"＞
    
    ＜tr bgcolor="#FFFFFF" onMouseOver="this.bgColor=‘#00CC00‘" onMouseOut="this.bgColor=‘#FFFFFF‘"＞
    
    ＜td＞ ＜/td＞
    
    ＜td＞ ＜/td＞
    
    ＜/tr＞
    
    ＜tr bgcolor="#FFFFFF"＞
    
    ＜td onMouseOver="this.bgColor=‘#FFFF00‘" onMouseOut="this.bgColor=‘#FFFFFF‘"＞ ＜/td＞
    
    ＜td onMouseOver="this.bgColor=‘#FFFF00‘" onMouseOut="this.bgColor=‘#FFFFFF‘"＞ ＜/td＞
    
    ＜/tr＞
    
    ＜/table〉
    

更多"HTML" 的相关消息

请选择您看到这篇新闻时的心情

查看结果　心情调查排行

佩服

微笑

难过

愤怒

路过

恶心