masyarakat Belajar Perpustakaan Alatan Masa lapang
cari
Melayu
Rumah > hujung hadapan web > tutorial js > 通过JavaScript控制字体大小的代码_javascript技巧

通过JavaScript控制字体大小的代码_javascript技巧

WBOY
Lepaskan： 2016-05-16 18:01:19
asal
1218 orang telah melayarinya

为了此代码到您的网页必须使用像素大小的字体（PX），而不是相对大小的字体，使用“EM”或“％”。当然如果你使用其他字体单位的代码可以很容易地适应这些。如果脚本不能找到一个段落的字体大小，它会默认为12px。
核心代码:

复制代码 代码如下:

var min=8;
var max=18;
function increaseFontSize() {
   var p = document.getElementsByTagName('p');
   for(i=0;i      if(p[i].style.fontSize) {
         var s = parseInt(p[i].style.fontSize.replace("px",""));
      } else {
         var s = 12;
      }
      if(s!=max) {
         s += 1;
      }
      p[i].style.fontSize = s+"px"
   }
}
function decreaseFontSize() {
   var p = document.getElementsByTagName('p');
   for(i=0;i      if(p[i].style.fontSize) {
         var s = parseInt(p[i].style.fontSize.replace("px",""));
      } else {
         var s = 12;
      }
      if(s!=min) {
         s -= 1;
      }
      p[i].style.fontSize = s+"px"
   }
}

包括上面的代码在您的网页（无论是放置在头部分，或将其放置在一个外部JS文件和进口）。然后可以调用的增加和减少象下面的字体大小的功能。
使用方法：
复制代码 代码如下:

-
+
Label berkaitan：
saiz fon
sumber：php.cn
Artikel sebelumnya：JS 如果改变span标签的是否隐藏属性_javascript技巧 Artikel seterusnya：javascript之querySelector和querySelectorAll使用说明_javascript技巧
Kenyataan Laman Web ini
Kandungan artikel ini disumbangkan secara sukarela oleh netizen, dan hak cipta adalah milik pengarang asal. Laman web ini tidak memikul tanggungjawab undang-undang yang sepadan. Jika anda menemui sebarang kandungan yang disyaki plagiarisme atau pelanggaran, sila hubungi admin@php.cn
Artikel terbaru oleh pengarang
Isu terkini
Gerakkan kandungan ke kiri dengan menambahkan sifat Width Saya telah memberikan margin kepada badan. utama {margin kiri: 200px; jidar kanan: 200px p...
daripada 2024-04-06 22:01:35
0
3
816
MySQL mendapat data daripada berbilang jadual Saya mempunyai jadual eg_design yang mengandungi lajur berikut: dan jadual eg_domains yang...
daripada 2024-04-06 18:42:44
0
2
479
Titik Scatterplot tidak mengekalkan nilai semasa mengezum masuk d3.js Ini adalah kali pertama saya menggunakan d3.js, jadi harap bersabar. Saya melaksanakannya ...
daripada 2024-04-06 18:16:26
0
1
403
React Three Fiber: Mengapa acara skrol saya ketinggalan? Dalam ReactThreeFiber, saya mempunyai komponen React yang menghasilkan sprite yang saya ma...
daripada 2024-04-06 13:39:24
0
1
410
Pelapik ibu bapa tidak diendahkan oleh anak yang berkedudukan melekit Bagaimana untuk mengelakkan unsur melekit daripada berada di belakang pengepala? Coretan k...
daripada 2024-04-06 11:42:51
0
1
338
Topik-topik yang berkaitan
Lagi>
Cadangan popular
Tutorial Popular
Lagi>
Tutorial berkaitan
Cadangan popular
Kursus terkini
Muat turun terkini
Lagi>
kesan web
Kod sumber laman web
Bahan laman web
Templat hujung hadapan