Dhtml网页实例教程(3)

来源:动态WEB脚本技术论坛 时间:2007-10-09 13:39:00 

Dhtml实例教程(三)

例4 使用onclick动态改变字体的颜色


<html> 
<head> 
<title>DHtml举例4</title> 
</head> 
<body> 
<h3 align="center" onmouseover="this.style.color=’red’" onmouseout="this.style.color=’green’" onclick="this.style.color=’blue’">我是变色龙!</h3> 
</body> 
</html> 


在这一例子中,当您把鼠标移动到文字上时,文字颜色变为红色,当鼠标离开文字时,文字颜色变为绿色,当在文字上单击鼠标时,文字颜色变成了蓝色。

下面是我用样式单制作的一个自认为比较漂亮的Html文件。

例5 “轻松自学动态HTML”的图形标志


<html> 
<head> 
<meta http-equiv="Content-Type" content="text/html; charset=gb2312"> 
<title>DHtml举例5 
<style> 
<!-- 
body {font-family:"宋体";font-size:9pt;color:#00aaff} 
h2.top {font-family:serif;font-size:9pt;color:yellow;text-align:right;background-color:rgb(174,0,0)} 
h2.bottom {font-family:serif;font-size:12pt;margin-left:-2pt;margin-top:-50pt} 
-- > 
</style> 
</head> 
<body bgcolor="#000000"> 
<br> 
<table align="center" border="0" width="27%" bgcolor="#000000" cellpadding="12"> 
<tr> 
<td width="168"><h2 class="top">轻 松 自 学  动  态  HTML</h2> 
<h2 class="bottom"><span style="font-size:50pt;color:lime"><i>t</i></span> 
  each   youself  DHtml</h2> 
</td> 
</tr> 
</table> 
</body> 
</html> 


请注意例子中的蓝色部分,class属性是用来定义标志对使用的样式类,如<h2 class="top">……</h2>指定了 <h2></h2>标志对中使用样式类“top”,而“top”则是在<style>< style>标志对中定义的。 OK,您会了吗?样式单就这么简单。

标签:html,dhtml,教程
0
投稿

猜你喜欢

  • SQL Server技巧之快速得到表的记录总数

    2011-01-04 14:36:00
  • Python3 log10()函数简单用法

    2021-06-27 16:47:16
  • Java读取数据库表的示例代码

    2024-01-15 05:41:08
  • 如何获取当前 select 元素的值

    2010-03-29 13:07:00
  • SQL Server数据库连接查询和子查询实战案例

    2024-01-15 02:44:21
  • ASP checkbox复选框是否被选中的代码(结合数据库)

    2011-03-06 11:21:00
  • vue中echarts的用法及与elementui-select的协同绑定操作

    2024-05-10 14:20:13
  • mysql 8.0.12 解压版安装教程

    2024-01-24 15:31:57
  • Mysql InnoDB多版本并发控制MVCC详解

    2024-01-23 16:46:25
  • Ubuntu Server 20.04 LTS 环境下搭建vim 编辑器Python IDE的详细步骤

    2023-06-02 05:13:18
  • JavaScript 中的 Base64 编码(一):Encode

    2010-07-23 10:16:00
  • python第三方库visdom的使用入门教程

    2021-12-08 22:32:51
  • Python ADF 单位根检验 如何查看结果的实现

    2021-05-24 13:40:39
  • python 图片验证码代码分享

    2022-02-21 17:10:27
  • javascript面向对象编程(三)

    2008-03-07 13:19:00
  • python自动发送邮件脚本

    2023-01-24 07:56:28
  • JavaScript实例--实现计算器

    2024-04-23 09:26:17
  • 详解django中视图函数的FBV和CBV

    2022-05-26 01:11:10
  • mysql主键,外键,非空,唯一,默认约束及创建表的方法

    2024-01-17 18:18:06
  • JavaScript EasyPager 分页函数

    2024-06-16 21:14:31
  • asp之家 网络编程 m.aspxhome.com