<!DOCTYPE html>
<html>
<head>
<meta http-equiv="content-type" content="txt/html; charset=utf-8" />
<title></title><style type="text/css">
a:link;a:visited{
color:#0044ff;
text-decoration: none;
}
a:hover{
color:#696969;
}
#a{
width: 500px;
border:black 1px solid;
padding: 10px;
}
.norm{
color: #696969;
font-size:24px;
background-color: #cdd850;
}
.big{
color: green;
font-size:28px;
background-color: #cdd850;
}
.small{
color: red;
font-size:20px;
background-color: #cdd850;
}
</style>
</head>
<body>
<!--思路：
1.先有新闻数据，并用标签封装
2，定义一些页面样式
3.确定事件源与事件，以及处理方式中被处理的节点
事件源：a标签
事件：onclick；
被处理的 节点:div-a
先取消超链接的默认样式，可以用javascript:void(0)来完成
-->
<script type="text/javascript">
//定义改变字体的方法
function getclass(name){
var oNewsText = document.getElementById("a");
oNewsText.className = name;
}
</script>
<h1>这是一个新闻标题</h1><hr/>
<a href="javascript:void(0)" onclick="getclass(‘big‘)"/>大字体</a>
<a href="javascript:void(0)" onclick="getclass(‘small‘)"/>小字体</a>
<hr/>
<div id ="a" class="norm">
这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容这是新闻内容</div>
</body>
</html>
原文地址：https://www.cnblogs.com/ziyihuang/p/8297700.html
时间： 2024-11-14 12:18:08