jquery正文文字字体大小调整效果代码-html代码-BFW代码库

jquery正文文字字体大小调整效果代码

代码语言：html

代码描述：jquery正文文字字体大小调整效果代码

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html>

<head>
    <meta charset="UTF-8">
    <title></title>
    <style>
        *      {  margin:0; padding:0;
      font-family:Arial, Helvetica, sans-serif; text-decoration:none;}
    
    body       {  background:#e7e7e7;margin:100px;}
    
    #wrapper   {  width:400px;
                  margin: 0 auto;
                  padding:40px;
                  background:#fff;
                  box-shadow:0 0 50px 0 rgba(0,0,0,.25);}
    
    #controls  {  float:right;
                  padding:2px;
                  width:30px;
                  background:#333;
                  position:fixed;
                  margin:0 0 0 440px;
                  text-align:center;
                  transition:.25s ease-out;}
    
    #controls a
               {  font-size:24px;
                  color:#aaa;
                  display:block;
                  font-weight:bold;
                  padding: 5px;}
    
    #controls a:hover
               {  color:#fff;
                  background:#000;
                  transition:.25s ease-out;}
    
    a.selected  {  background:#000;
                   color:#fff !important;}
    
    #small     {  font-size:10px !important;}
    #medium    {  font-size:14px !important;}
    #large     {  font-size:18px  !important;}
    
    .small     {  font-size:75%;}
    
    h1         {  font-size:36px;
                  font-weight:bold;}
    
    h2         {  font-size:24px;
                  margin: 10px 0;}
     
    p          {  font-size:14px;
                  line-height:20px;}
    </style>
</head>

<body>
    <div id="wrapper">
        <div id="controls"> <a href="#" id="small">A</a> <a href="#" id="medium" class="selected">A</a> <a href="#" id="large">A</a.........完整代码请登录后点击上方下载按钮下载查看