网页设计程序题！！在线等答案~急
有个区间文字，字号为h1，提供一个文本框，用户输入h2-h7，点击按钮后可以改变此区间的字号~<!--h1应该是一个数字+单位的值，例如12px-->是什么意思~...
有个区间文字，字号为h1，提供一个文本框，用户输入h2-h7，点击按钮后可以改变此区间的字号~
<!--h1应该是一个数字+单位的值，例如12px-->
是什么意思~ 展开
<!--h1应该是一个数字+单位的值，例如12px-->
是什么意思~ 展开
2个回答
展开全部
很简单，首先制作h1-h7字体大小的css
定义7个class
.c_h1{font-size:28px;}
.c_h2{font-size:24px;}
.c_h3{font-size:20px;}
.c_h4{font-size:16px;}
.c_h5{font-size:14px;}
.c_h6{font-size:12px;}
.c_h7{font-size:11px;}
然后容器为
<div class="{c_h1~c_h7之间的某个，一开始可以默认为c_h5}"></div>
然后用js判断填写的字体大小即可
全部代码在下面：
<!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 type="text/css">
.c_h1{font-size:28px;}
.c_h2{font-size:24px;}
.c_h3{font-size:20px;}
.c_h4{font-size:16px;}
.c_h5{font-size:14px;}
.c_h6{font-size:12px;}
.c_h7{font-size:11px;}
</style>
<script type="text/javascript">
function changeSize(){
c_size = document.getElementById("text_size").value;
c_content = document.getElementById("content");
switch(c_size)
{
case 'h1':
c_content.className='c_h1'
break
case 'h2':
c_content.className='c_h2'
break
case 'h3':
c_content.className='c_h3'
break
case 'h4':
c_content.className='c_h4'
break
case 'h5':
c_content.className='c_h5'
break
case 'h6':
c_content.className='c_h6'
break
case 'h7':
c_content.className='c_h7'
break
default:
alert('你输入的字体大小有误')
}
}
</script>
</head>
<body>
<div class="h5" id="content">这里是要变字体的文字</div>
<input type="text" value="" id="text_size"/>
<input type="button" value="改变字体" onclick="changeSize()"/>
</body>
</html>
定义7个class
.c_h1{font-size:28px;}
.c_h2{font-size:24px;}
.c_h3{font-size:20px;}
.c_h4{font-size:16px;}
.c_h5{font-size:14px;}
.c_h6{font-size:12px;}
.c_h7{font-size:11px;}
然后容器为
<div class="{c_h1~c_h7之间的某个，一开始可以默认为c_h5}"></div>
然后用js判断填写的字体大小即可
全部代码在下面：
<!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 type="text/css">
.c_h1{font-size:28px;}
.c_h2{font-size:24px;}
.c_h3{font-size:20px;}
.c_h4{font-size:16px;}
.c_h5{font-size:14px;}
.c_h6{font-size:12px;}
.c_h7{font-size:11px;}
</style>
<script type="text/javascript">
function changeSize(){
c_size = document.getElementById("text_size").value;
c_content = document.getElementById("content");
switch(c_size)
{
case 'h1':
c_content.className='c_h1'
break
case 'h2':
c_content.className='c_h2'
break
case 'h3':
c_content.className='c_h3'
break
case 'h4':
c_content.className='c_h4'
break
case 'h5':
c_content.className='c_h5'
break
case 'h6':
c_content.className='c_h6'
break
case 'h7':
c_content.className='c_h7'
break
default:
alert('你输入的字体大小有误')
}
}
</script>
</head>
<body>
<div class="h5" id="content">这里是要变字体的文字</div>
<input type="text" value="" id="text_size"/>
<input type="button" value="改变字体" onclick="changeSize()"/>
</body>
</html>
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
展开全部
<html>
<head>
<title>改变文字大小</title>
<style type="text/css">
#mytxt{font-size:h1;}
<!--h1应该是一个数字+单位的值，例如12px-->
</style>
<script language="javascript" type="text/javascript">
function changefont(Tsize){
document.getElementById("mytxt").style.fontSize=Tsize+"px";
return false;
}
</script>
</head>
<body>
<div id="mytxt">U word</div><!--显示你的文字-->
<form action="" method="get" onSubmit="return changefont(document.getElementById('input').value)">
<input name="input" type="text"><!--在此输入你的大小，例如14-->
<input type="submit" name="button" id="button" value="提交">
</form>
</body>
</html>
<head>
<title>改变文字大小</title>
<style type="text/css">
#mytxt{font-size:h1;}
<!--h1应该是一个数字+单位的值，例如12px-->
</style>
<script language="javascript" type="text/javascript">
function changefont(Tsize){
document.getElementById("mytxt").style.fontSize=Tsize+"px";
return false;
}
</script>
</head>
<body>
<div id="mytxt">U word</div><!--显示你的文字-->
<form action="" method="get" onSubmit="return changefont(document.getElementById('input').value)">
<input name="input" type="text"><!--在此输入你的大小，例如14-->
<input type="submit" name="button" id="button" value="提交">
</form>
</body>
</html>
本回答被提问者采纳
已赞过
已踩过<
评论
收起
你对这个回答的评价是？
推荐律师服务：
若未解决您的问题，请您详细描述您的问题，通过百度律临进行免费专业咨询
