sinat_29446327 2015-07-02 04:24 采纳率: 40%
浏览 2155

新手提问，页面制作知识

给页面设定两个不同的简单样式（文字颜色大小）通过按钮来选择样式。用js，html，css制作。新手程序员，虽然学了些，但是用起来就不行，求各位前辈帮忙给个思路或者写个小例子，感激不尽

  • 写回答

7条回答 默认 最新

  • JPF1024 2015-07-02 05:23
    关注
     <!DOCTYPE HTML >
<html>
<head>
<title>切换</title>
<meta charset="utf-8"/>
<style type="text/css">

  .fontsmall {
    font-size: 12px;
    color:red;
  }

  .fontmax {
    font-size: 72px;
    color:blue;
  }




</style>
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script>
<script type="text/javascript">
  $(document).ready(function(){
     $("#changefonts").click(function(){
        var fontclass=$("#testf").attr("class");
        if(typeof(fontclass)=="undefined"){
          //如果还没有class,就添加一个
          $("#testf").addClass("fontsmall");
        }else{
          //切换class
          if(fontclass=="fontsmall"){  
              $("#testf").removeClass("fontsmall");//先删除原来的class
              $("#testf").addClass("fontmax");//添加新的

              //也可以下面这样写.
              //$("#testf").removeClass("fontsmall").addClass("fontmax");
          }else if(fontclass=="fontmax"){
               $("#testf").removeClass("fontmax");
               $("#testf").addClass("fontsmall");
          }
        }
     })



  })


</script>
</head>
<body>
  <div id="testf" class="fontsmall">这里是测试文字.</div>

  <div style="margin-top:10px;">
    <input type="button" value="切换" id="changefonts">
  </div>
</body>
</html>
    评论

报告相同问题？

悬赏问题

  • ¥15 2020长安杯与连接网探
  • ¥15 关于#matlab#的问题：在模糊控制器中选出线路信息，在simulink中根据线路信息生成速度时间目标曲线（初速度为20m/s，15秒后减为0的速度时间图像）我想问线路信息是什么
  • ¥15 banner广告展示设置多少时间不怎么会消耗用户价值
  • ¥16 mybatis的代理对象无法通过@Autowired装填
  • ¥15 可见光定位matlab仿真
  • ¥15 arduino 四自由度机械臂
  • ¥15 wordpress 产品图片 GIF 没法显示
  • ¥15 求三国群英传pl国战时间的修改方法
  • ¥15 matlab代码代写，需写出详细代码，代价私
  • ¥15 ROS系统搭建请教（跨境电商用途）