分享一下我老师大神的人工智能教程!零基础,通俗易懂!
也欢迎大家转载本篇文章。分享知识,造福人民,实现我们中华民族伟大复兴!
在页面和浏览器中,除了文字、图片、表格、表单等,还有很多各种各样的元素,在上篇博文中,小编主要简单的介绍了一下在CSS中如何设置表格和表单,今天小编主要简单介绍一下丰富的超链接特效、鼠标特效、页面滚动条。首先我们来看一张思维导图:
接着,小编会跟随上述思维导图的足迹,慢慢探寻,丰富的超链接特效中,我们首先来介绍动态超链接,我们来看一下例子的代码和运行的效果:
动态超链接
<span style="font-size:18px;"><span style="font-size:18px;"><html><head><title>动态超链接</title><style><!--body{ background:url(bg9.gif); margin:0px; padding:0px; cursor:pointer;}.chara1{ font-size:12px; background-color:#90bcff; }.chara1 td{ text-align:center;}a:link{ color:#005799; text-decoration:none; }a:visited{ color:#000000; text-decoration:none; }a:hover{ color:#FFFF00; text-decoration:underline; }--></style> </head><body><table align="center" cellpadding="1" cellspacing="0"> <tr><td><img src="banner3.jpg" border="0"></td></tr></table><table width="600px" cellpadding="2" cellspacing="2" class="chara1" align="center"> <tr> <td><a href="#">首页</a></td> <td><a href="#">心情日记</a></td> <td><a href="#">Free</a></td> <td><a href="#">一起走到</a></td> <td><a href="#">从明天起</a></td> <td><a href="#">纸飞机</a></td> <td><a href="#">下一站</a></td> </tr></table></body></html></span></span>
运行效果如下所示:
分析一下上面的代码,我们很容易可以看出,首先将一个table标记将页面中的banner分离开来,其次将一个table标记将一个横排的一个菜单,实现一个很漂亮的浏览效果。在这里我们值得一下的是:a:link、a:visited、a:hover来分别设置动态了超链接的效果。我们接下来看看按钮式超链接,我们看看例子代码和运行效果
按钮式超链接
<span style="font-size:18px;"><html><head><title>按钮超链接</title><style><!--a{ font-family: Arial; font-size: .8em; text-align:center; margin:3px;}a:link, a:visited{ color: #A62020; padding:4px 10px 4px 10px; background-color: #ecd8db; text-decoration: none; border-top: 1px solid #EEEEEE; border-left: 1px solid #EEEEEE; border-bottom: 1px solid #717171; border-right: 1px solid #717171;}a:hover{ color: