<!DOCTYPE HTML>

 <html>

 <head>

 <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

 <title>无标题文档</title>

 <script>

 window.onload = function (){

     var oBtn1 = document.getElementById('btn1');

     var oBtn2 = document.getElementById('btn2');

     var oBtn3 = document.getElementById('btn3');

     var oBtn4 = document.getElementById('btn4');

     var oP = document.getElementById('p1');

     var num = ;

     oBtn1.onclick = function (){

         num -= ;

         oP.style.fontSize = num + 'px';

         // JS 不允许出现"-"

         // padding-top        paddingTop

         // margin-left        marginLeft

     };

     oBtn2.onclick = function (){

         // num = num + 2;

         num += ;

         oP.style.fontSize = num + 'px';

         // JS 不允许出现"-"

     };

     oBtn3.onclick = function (){

         // oP.class = 'red';

         // class => className

         oP.className = 'red';

     };

     oBtn4.onclick = function (){

         // oP.class = 'red';

         // class => className

         oP.className = 'yellow';

     };

 };

 </script>

 <style>

 .red { width:400px; border:10px solid #; background:red; padding:20px; color:yellow; }

 .yellow { width:500px; border:5px solid #; background:yellow; padding:10px; color:red; }

 </style>

 </head>

 <body>

 <input id="btn1" type="button" value="-" />

 <input id="btn2" type="button" value="+" />

 <input id="btn3" type="button" value="红" />

 <input id="btn4" type="button" value="黄" />

 <p id="p1" style="font-size:16px;">10月28日晚，中央纪委监察部官网发布消息，贵州省委常委、遵义市委书记廖少华因涉嫌严重违纪违法接受组织调查。3天后中组部宣布对其免职。廖成为十八大后中纪委一连串"打虎"行动中第十一位落马的副省部级以上高官。</p>

 </body>

 </html>

JS的className，字体放大缩小的更多相关文章

  1. JS中图片的放大缩小没反应

    这段代码无反应: 代码如下: <script type="text/javascript"> onload = function () { document.getEl ...

  2. js监听页面放大缩小

    <!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>d ...

  3. ubuntu终端下快捷键之--字体放大缩小

    1.快捷键 Ctrl  -   字体缩小 Ctrl  + (有的电脑是“Ctrl Shift +” 三个按键同时按下)字体放大 Ctrl 0  恢复默认字体 2.终端设置默认字体 在终端下,点击右键- ...

  4. JS控制图片拖动 放大 缩小 旋转 支持滚轮放大缩小 IE有效

    <html> <head>     <title>图片拖动,放大,缩小,转向</title> <script type="text/ja ...

  5. pycharm字体放大缩小设置

    放大设置 File —> settings—> Keymap —>在搜寻框中输入:increase —> Increase Font Size(双击) —> 在弹出的对话 ...

  6. pycharm动态设置字体放大缩小

    放大设置 File —> settings—> Keymap —>在搜寻框中输入:increase —> Increase Font Size(双击) —> 在弹出的对话 ...

  7. JetBrains PyCharm 2017.2 字体放大缩小 功能

  8. js判断页面放大缩小

    项目中,经常会碰到页面被放大或者缩小,导致页面显示错误,js可以判断页面放大缩小. // 若返回100则为默认无缩放,如果大于100则是放大,否则缩小 function detectZoom (){ ...

  9. JQuery实现最字体的放大缩小

    网页常常有对字体放大缩小的需求,我们不妨来看一下下面这段JQuery代码的实现. 假如在html页面代码中我们有这么一段代码: <p>啦啦啦啦啦啦啦啦啦啦</p> 那么JQue ...

随机推荐

  1. Openjudge-计算概论（A）-称体重

    描述: 赵.钱.孙.李四个人中既有大人也有小孩,给他们称体重时发现,他们每个人的体重都不一样,且体重(单位:公斤)恰好是10的整数倍,且他们的体重都不高 于50公斤,已知赵.钱两人的体重之和恰好等于孙 ...

  2. 3.1 Data Member的绑定

       文章开始提出了一段示例代码,并讨论了返回哪个x的问题.然后 a)   给出了我们普遍认为正确的回答,并肯定了这个想法: b)   提醒大家,这在以前的编译器实现中,并非正确. 在早期的实现中,首 ...

  3. 归并排序的go语言与C++实现对比

    最近对go语言发生了兴趣,发现go语言语法简洁,非常适合算法的描述和实现,于是对归并排序进行了实现. 例子中需要排序的队列是长度为100的从100到1的数列,排序算法是正序排序,排序正确的话,结果应当 ...

  4. 什么是JDBC？

    JDBC是Java数据库连接(Java DataBase Connectivity)技术的简称,提供连接各种常用数据库的能力! 1.方式一(配置文件实现): <!-- 1. 连接池实例 --&g ...

  5. HeapSpray初窥(2014.12)

    注:环境是xp+ie8 1.HeapSpray简介 Windows的堆因为动态分配和释放的特点,其看起来是不连续(没有规律的),但是仍可以找到一定的规律:大量的连续分配会更倾向使用连续的地址,减少了碎 ...

  6. Git Bash 简单操作

    在Windows下使用Git Bash,用的是Linux命令,常用几个文件操作命令如下: Windows命令 Linux命令 意义 cd e:\xxx cd /e/xxx 切换到xxx目录 cd pw ...

  7. 清空form

    在清空form是遇到问题 document.formname.reset(); 当reset对checkbox不起作用时,清空其需要用 $(" ").attr("chec ...

  8. 分析函数 over用法 之row_number() runk_number

    分析函数用于计算基于组的某种聚合值,每个组返回多个行,而聚合函数每个组只返回一个行 表: create table TB_SCORE ( id NUMBER(10), class VARCHAR2(1 ...

  9. web.config中httpModules和Modules的区别

    最近用到了mvc的 Modules管道时,发现web.config中有两个modules 1.system.web节点下的httpModules 2.system.webServer节点下的modul ...

  10. iosOC不可变字典和可变字典

    //key 和 value 都属于(id)对象类型 //key常用字符串NSString来表示 //存储数值型 一般可用 NSString //int  age ->@(age) //  [di ...