网络编程 | 站长之家 | 网页制作 | 图形图象 | 操作系统 | 冲浪宝典 | 软件教学 | 网络办公 | 邮件系统 | 网络安全 | 认证考试 | 系统进程
Firefox | IE | Maxthon | 迅雷 | 电驴 | BitComet | FlashGet | QQ | QQ空间 | Vista | 输入法 | Ghost | Word | Excel | wps | Powerpoint
asp | .net | php | jsp | Sql | c# | Ajax | xml | Dreamweaver | FrontPages | Javascript | css | photoshop | fireworks | Flash | Cad | Discuz!
当前位置 > 网站建设学院 > 网页制作 > CSS
网页制作:Dreamweaver教程,FrontPages教程,Javascript教程,HTML教程,CSS教程,心得技巧,DHTML教程,网页特效,Discuz!论坛
本月文章推荐
.CSS经典实用技巧18招.
.CSS解决图片下面有空隙的简单方法.
.CSS布局之浮动(一).
.CSS技巧补遗二十四则.
.实例详解CSS网页布局原理.
.CSS+DIV设计实例:不同色链接和其.
.纯CSS实现的可包含html的title提.
.CSS层叠样式的主次顺序.
.网页布局中CSS的Class灵活应用.
.CSS超级技巧大放送合集.
.CSS高级应用:定义列表的特殊用法.
.CSS+DIV设计实例:超酷的竖排导航.
.精通 CSS 滤镜(一).
.CSS模块化设计—从空格谈起.
.IE6 IE7 FF CSS HACK .
.拒绝单调 让网页超链接拥有多姿多.
.使用CSS定位页面的“footer”.
.CSS Sprites技术以及图片优化.
.初学CSS和标准建站的一些CSS常用.
.关于客户端XHTML,CSS和JavaScri.

css彩色虚线表格及JS鼠标指向单元格变色制作方法

发表日期:2008-10-20


在我们制作主页的过程中,用到表格的地方非常多,灵活运用表格技巧可以为我们的网页增色不少,这里我就详细介绍CSS彩色虚线表格及JS鼠标指向单元格变色制作方法

一、CSS彩色虚线表格

<style type="text/css">
<!--
.tab1 {
border-top-width: thin;
border-right-width: thin;
border-bottom-width: thin;
border-left-width: thin;
border-top-style: dotted;
border-right-style: dotted;
border-bottom-style: dotted;
border-left-style: dotted;
border-top-color: #00CC66;
border-right-color: #0099CC;
border-bottom-color: #FF0000;
border-left-color: #6699FF;
}
-->
</style>
<p> </p>
<table width="230" border="0" cellpadding="2" cellspacing="2" class="tab1" align=center>
<tr>
<td><div align="center">中国asp之家</div></td>
<td><div align="center">虚线</div></td>
</tr>
<tr>
<td><div align="center">样式</div></td>
<td><div align="center">www.devdao.com</div></td>
</tr>
</table>

二、JS鼠标指向单元格变色


onmouseout="this.style.backgroundColor=''"    鼠标离开效果onmouseover="this.style.backgroundColor='#FFcccc'"   鼠标放上去的效果,

如果想让鼠标点击时改变单元格背景色可以这么写

onclick="this.style.backgroundColor='#FFcccc'"

可以修改#FFcccc的值来改变颜色

<table width="227" border="1" cellspacing="0" cellpadding="0" align=center>
<tr>
<td onmouseout="this.style.backgroundColor=''" onmouseover="this.style.backgroundColor='#FFcccc'" height=30>鼠标指向单元格变色</td>
</tr>
<tr>
<td onmouseout="this.style.backgroundColor=''" onmouseover="this.style.backgroundColor='#FFccaa'" height=30>中国Asp之家,Aspxhome.com</td>
</tr>
</table>

上一篇:CSS Sprites图片切割术与图片优化 人气:733
下一篇:挺不错的CSS颜色搭配 人气:958
浏览全部css的内容 Dreamweaver插件下载 网页广告代码 祝你圣诞节快乐 2009年新年快乐