目次
ディスカッションへの返信 (解決策)

フォントサイズ_html/css_WEB-ITnose

Jun 21, 2016 am 09:03 AM
フォントサイズ


A のサイズを変更して、現在のページのフォント サイズを変更するにはどうすればよいですか?


ディスカッションへの返信 (解決策)

単純な CSS ではこのタスクを完了できず、js の介入が必要です。

window.onload = function(){    var content = document.getElementById('content');    var btn = document.getElementById('btn');    var btns = btn.getElementsByTagName('button');    for(var i = 0; i < btns.length; i++){        btns[i].index = i;        btns[i].onclick = function(){            changeSize(this.index);        }    }    var arr = ['12px', '14px', '16px'];    function changeSize(n){        content.style.fontSize = arr[n];    }};
ログイン後にコピー

完全なコード:
<!doctype html><html><head>    <meta charset="UTF-8">    <title></title></head><body><div id="btn">    <button>小</button>    <button>中</button>    <button>大</button></div><div id="content">    <p>1. 健康</p>    <ul>        <li>你会精力充沛,呼吸顺畅</li>        <li>你会患上肺癌、呼吸系统疾病、心脏病</li>    </ul></div><script>    window.onload = function(){        var content = document.getElementById('content');        var btn = document.getElementById('btn');        var btns = btn.getElementsByTagName('button');        for(var i = 0; i < btns.length; i++){            btns[i].index = i;            btns[i].onclick = function(){                changeSize(this.index);            }        }        var arr = ['12px', '14px', '16px'];        function changeSize(n){            content.style.fontSize = arr[n];        }    };</script></body></html>
ログイン後にコピー

“Ems”: em,大小不固定 ,成为相对单位(body则相对浏览器的默认字体设置,子集相对父级), 浏览器默认设置字体大小为16px , 则1em = 16px , 且其可扩展,2em = 32px , 目前常用的字体大小px换算成em , 他们把字体大小用em 来表示,通过改变bodyd的什么就可以改变字体的大小请问这种写法要怎么写??
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー

“Ems”: em,大小不固定 ,成为相对单位(body则相对浏览器的默认字体设置,子集相对父级), 浏览器默认设置字体大小为16px , 则1em = 16px , 且其可扩展,2em = 32px , 目前常用的字体大小px换算成em , 他们把字体大小用em 来表示,通过改变bodyd的什么就可以改变字体的大小请问这种写法要怎么写??
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー



いいえ本文を直接変更することをお勧めします。すべてのフォントが同じサイズになります。明日は例を書きます。


“Ems”: em,大小不固定 ,成为相对单位(body则相对浏览器的默认字体设置,子集相对父级), 浏览器默认设置字体大小为16px , 则1em = 16px , 且其可扩展,2em = 32px , 目前常用的字体大小px换算成em , 他们把字体大小用em 来表示,通过改变bodyd的什么就可以改变字体的大小请问这种写法要怎么写??
ログイン後にコピー
ログイン後にコピー
ログイン後にコピー



ボディを直接変更することはお勧めできません。問題が発生しやすく、すべてのフォントで問題が発生します。同じ大きさになります。明日は例を書きます。



ありがとうございます!
必要な効果は、A のサイズをクリックしてすべてのページのフォント サイズを変更することです
フォント サイズを変更できる場合は、em を使用します固定サイズの場合は、px

$("html").css("font-size","12px"); で記述します。 "font-size:1rem" >123

1x 12px
456
2x 24px

<HTML><HEAD><TITLE>特定区域文字控制</TITLE><STYLE type=text/css>BODY {	MARGIN-TOP: 0px; FONT-SIZE: 9pt; MARGIN-LEFT: 0px; MARGIN-RIGHT: 0px; FONT-FAMILY: "宋体"}A {	FONT-WEIGHT: 400; FONT-SIZE: 9pt; COLOR: black; TEXT-DECORATION: none}A:hover {	FONT-WEIGHT: 400; FONT-SIZE: 9pt; COLOR: red; TEXT-DECORATION: underline}A:active {	FONT: 9pt "宋体"; CURSOR: hand; COLOR: #ff0033}.STYLE1 {	font-size: 40px;	font-family: "华文行楷";	color: #990000;}.STYLE2 {	font-size: 30px;	font-weight: bold;	font-family: "黑体";	color: #0000FF;}</STYLE><META http-equiv=Content-Type content="text/html; charset=gb2312"><META content="MSHTML 6.00.2900.2180" name=GENERATOR></HEAD><BODY bgColor=#fef4d9><BR><BR><CENTER><TABLE borderColor=#993399 border=5 borderlight="green">  <TBODY>    <TR>    <TD align=middle>      <SCRIPT language=JavaScript>function doZoom(size){	document.getElementById('zoom').style.fontSize=size+'px'}</SCRIPT>      <TABLE       style="BORDER-RIGHT: #336699 1px solid; BORDER-TOP: #336699 1px solid; BORDER-LEFT: #336699 1px solid; BORDER-BOTTOM: #336699 1px solid"       cellSpacing=0 width=200 align=center bgColor=#93bee2 border=0>        <TBODY>        <TR>          <TD style="BORDER-BOTTOM: #336699 1px solid" width="83%"           bgColor=#00FFFF>[<A href="javascript:doZoom(20)">大字</A> <A             href="javascript:doZoom(14)">中字</A> <A             href="javascript:doZoom(9)">小字</A>]            <DIV></DIV></TD></TR>        <TR bgColor=#ffffff>  <TD id=zoom colSpan=2><div align="center">文字大小变化哦</div></TD></TR></TBODY></TABLE></TD></TR></TBODY></TABLE></CENTER></BODY></HTML>
ログイン後にコピー

このウェブサイトの声明
この記事の内容はネチズンが自主的に寄稿したものであり、著作権は原著者に帰属します。このサイトは、それに相当する法的責任を負いません。盗作または侵害の疑いのあるコンテンツを見つけた場合は、admin@php.cn までご連絡ください。

ホットAIツール

Undresser.AI Undress

Undresser.AI Undress

リアルなヌード写真を作成する AI 搭載アプリ

AI Clothes Remover

AI Clothes Remover

写真から衣服を削除するオンライン AI ツール。

Undress AI Tool

Undress AI Tool

脱衣画像を無料で

Clothoff.io

Clothoff.io

AI衣類リムーバー

AI Hentai Generator

AI Hentai Generator

AIヘンタイを無料で生成します。

ホットツール

メモ帳++7.3.1

メモ帳++7.3.1

使いやすく無料のコードエディター

SublimeText3 中国語版

SublimeText3 中国語版

中国語版、とても使いやすい

ゼンドスタジオ 13.0.1

ゼンドスタジオ 13.0.1

強力な PHP 統合開発環境

ドリームウィーバー CS6

ドリームウィーバー CS6

ビジュアル Web 開発ツール

SublimeText3 Mac版

SublimeText3 Mac版

神レベルのコード編集ソフト(SublimeText3)

Win10フォルダーのフォントサイズを調整するにはどうすればよいですか? Win10フォルダーのフォントサイズを調整するにはどうすればよいですか? Jun 30, 2023 pm 08:02 PM

Windows 10 コンピューターでフォルダーのフォント サイズを設定するにはどうすればよいですか? win10フォルダーのフォントサイズを設定する方法は、まず左下隅をクリックして開始し、選択して設定を開きます。操作方法を知らない友人も多いと思いますが、フォルダーのフォントサイズを設定する手順をエディターが以下にまとめましたので、興味のある方はエディターをフォローして読み進めてください。フォルダーのフォント サイズを設定する方法 ステップ 1. まず左下隅をクリックして開始し、[設定を開く] を選択します。 2. 次に「システム」をクリックします。 3. 左側の「画面」をクリックします。 4. 右側にある「テキスト、アプリケーションなどのサイズを変更する」を見つけます。 5. 最後に、ドロップダウン メニューをクリックして 100% を選択します。以上が【win10パソコンでフォルダーのフォントサイズを設定する方法 - フォルダーのフォントサイズを設定する手順】の全内容です。

OnePlus でフォント サイズを調整する方法_OnePlus でのフォント サイズの設定に関するチュートリアル OnePlus でフォント サイズを調整する方法_OnePlus でのフォント サイズの設定に関するチュートリアル Mar 23, 2024 am 08:31 AM

1. 携帯電話の [設定] を開き、[ディスプレイ] オプションをクリックします。 2. 表示設定ページに入ったら、[フォント サイズ] オプションをクリックします。 3. フォント サイズ設定ページに入り、スライダーを左右にドラッグしてフォント サイズを調整します。

Eclipseでフォントサイズを設定する方法 Eclipseでフォントサイズを設定する方法 Jan 23, 2024 pm 03:09 PM

設定手順: 1. Eclipse を開き、メニュー バーの [ウィンドウ] -> [設定] に入ります; 2. [一般] -> [外観] -> [色とフォント] を選択します; 3. [基本] -> [テキスト フォント] を展開し、右側の [編集] ボタンをクリックします; 4.フォント、フォント、サイズ、その他の属性については、12、14、16 など、個人のニーズに応じて適切なフォント サイズを選択します。 5. [適用] ボタンをクリックして、変更を適用します。

Apple携帯電話でフォントサイズを設定する方法 Apple携帯電話でフォントサイズを設定する方法 Mar 08, 2024 pm 03:40 PM

Apple 携帯電話のフォント サイズの設定方法は比較的簡単ですが、具体的な設定方法がわからないユーザーも多く、携帯電話の設定でフォント サイズを調整する方法と、ユーザー補助機能でフォント サイズを調整する方法の 2 つがあります。 Apple 電話でフォント サイズを設定するにはどうすればよいですか? 回答: 電話の設定とアクセシビリティ機能を通じてサイズを設定します 1. ユーザーは電話の設定をクリックして、ディスプレイと明るさのメニューに入ります。 2. クリックしてスライドすると、[表示と明るさ] でテキスト サイズのオプションが表示されます。 3. スライダーをスライドさせて文字の大きさを設定し、右にスライドすると大きくなり、左にスライドすると小さくなります。 4. ユーザーは、Apple 携帯電話の補助機能を通じてフォント サイズを設定することもできます。 5. [設定の表示と明るさ] で、下にスライドして [アクセシビリティ] ボタンを見つけてクリックします。 6. 表示の選択

回答: WPS ドキュメントのフォント サイズを調整する方法を知る必要があります。 回答: WPS ドキュメントのフォント サイズを調整する方法を知る必要があります。 Mar 20, 2024 pm 09:06 PM

こんにちは!こんにちは、学生の皆さん、再びコースを共有するためにここに来ました!現在オフィスでよく使われているWPSは強力な機能を持ち、オフィスワークには欠かせないソフトウェアです。 WPS を初めて使用する学生も多く、WPS 文書の文字を拡大するのは非常に難しいと思います。今回は、WPSドキュメントのフォントサイズを調整する方法を詳しく紹介します。誰でも理解しやすいように、【WPS文書のフォントサイズを変更する】をステップごとにまとめてみましたので、お役に立てれば幸いです。デスクトップで「WPS テキスト」アイコンを見つけて開き、「HelloWorld」などの必要なテキストを入力します。 WPS テキストのデフォルトのフォント サイズはサイズ 5 であることに注意してください。 2. 大きくしたいフォントを選択し、「大」をクリックします。

win10教育版のフォントサイズの設定方法 win10教育版のフォントサイズの設定方法 Feb 16, 2024 pm 01:33 PM

Win10 Education Edition を使用すると、フォントが小さすぎてよく見えないと感じる人も多いと思いますが、個人用設定にフォント機能があり、フォント サイズに応じて調整できます。 win10 教育バージョンのフォント サイズを設定する方法: 1. Windows 設定インターフェイスに入り、オプションを選択します。 2. パーソナライゼーションページに入ったら、機能モジュールをクリックします。 3. フォント インターフェイスで、使用するフォントを選択します。 4. 最後に、必要に応じてフォント サイズを調整します。

Win10 のフォントが小さすぎるため、125% に拡大するとぼやけ始めます Win10 のフォントが小さすぎるため、125% に拡大するとぼやけ始めます Feb 13, 2024 pm 08:24 PM

現在のラップトップの解像度は非常に高いですが、画面は通常 13 ~ 16 インチです。フォント スケーリングを 100% に設定すると、画面上のテキストが読みにくくなります。125% に設定すると、一部のソフトウェア フォントが読みにくくなります。ぼやけているか、右クリックしたプロパティ パネルがまだぼやけています。 Win10 のフォントが小さすぎるため、125% にズームインするとぼやけ始めます。解決策: 1. 解決策は、124% の拡大縮小率を選択することです。フォントは 125% と同じサイズに見えますが、ぼやけません。デスクトップの空きスペースを右クリックし、2、中を選択します。一般的に使用されるオプションは 100% または 125% です。欠点は明らかです。100% の文字は小さすぎて鮮明ですが、125% の文字は十分な大きさです。しかしぼやけてます。この時点では、3 をクリックする必要があります。この詳細設定ページで、カスタム スケーリング率 4 を入力します。コンピュータを再起動すると有効になります。再起動後、レンダリングが表示され、プロパティ パネルと

テキストメッセージの文字サイズを調整する方法 テキストメッセージの文字サイズを調整する方法 Aug 29, 2023 am 11:38 AM

テキスト メッセージのフォント サイズを調整する方法: 1. iOS デバイスで、[設定] アプリケーションを開き、[表示と明るさ] オプションを選択し、[テキスト サイズ] スライダーを見つけて、スライダーをスライドしてサイズを調整します。デバイス全体のテキストのテキスト サイズ(テキスト メッセージ内のテキストを含む) 2. Android デバイスで、「設定」アプリケーションを開き、「表示」オプションを選択し、「フォント サイズ」オプションを見つけます。さまざまなフォント サイズを選択して、テキスト メッセージ内のテキストをプレビューおよび調整します。フォント サイズ。

See all articles