字体变大变小

<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8" />
<title>无标题文档</title>
<style>
* {
font-size:12px
}
</style>
<script>
window.onload = function(){
var Oreduce = document.getElementById('reduce');
var Oadd = document.getElementById('add');
var Ocontent = document.getElementById('content');
num = 12;
Oreduce.onclick = function(){
if(num > 12 ){
num--;
Ocontent.style.fontSize = num+'px';
}
}
Oadd.onclick = function(){
if(num < 22){
num++;
Ocontent.style.fontSize = num+'px';
}
}
}
</script>
</head>


<body>
<div>
<div class="botton_con">
<input type="button" value="-" id="reduce" />
<input type="button" value="+" id="add"/>
</div>
<div id="content">收到更好的发挥的发挥的风格收到更好的发挥的发挥的风格收到更好的发挥的发挥的风格收到更好的发挥的发挥的风格收到更好的发挥的发挥的风格收到更好的发挥的发挥的风格收到更好的发挥的发挥的风格收到更好的发挥的发挥的风格收到更好的发挥的发挥的风格收到更好的发挥的发挥的风格收到更好的发挥的发挥的风格收到更好的发挥的发挥的风格收到更好的发挥的发挥的风格收到更好的发挥的发挥的风格收到更好的发挥的发挥的风格收到更好的发挥的发挥的风格收到更好的发挥的发挥的风格收到更好的发挥的发挥的风格收到更好的发挥的发挥的风格</div>
</div>
</body>
</html>

posted @ 2019-12-16 19:42  Cutelady  阅读(101)  评论(0编辑  收藏  举报