使用 Javascript 调整字母大小
Resizing Letters Using Javascript
我希望能够在单击右侧不同大小的字母时更改字体大小。我如何使用javascript命令网站做到这一点?这是我到目前为止的代码:
<!DOCTYPE html>
<html>
<head>
<body>
<div>
<font size="2"><a href="javascript:void(0);" onclick="changemysize(16);">A</a></font>
<font size="4"><a href="javascript:void(0);" onclick="changemysize(20);">A</a></font>
<font size="5"><a href="javascript:void(0);" onclick="changemysize(25);">A</a></font>
</div>
<div id="callout" class="medium">
<ul id="controls">
<li id="small">A</li>
<li id="medium">A</li>
<li id="large">A</li>
</ul>
<div id="mymain">
<h1>Header</h1>
<h2>Subheader</h2>
<p>Lorem ipsum dolor sit amet, pri ne periculis definiebas, habeo gloriatur has id. Ius ad ubique animal, eum recteque electram explicari no, sed in nostrum adipiscing. Lorem ipsum dolor sit amet, pri ne periculis definiebas, habeo gloriatur has id.</p>
</div>
</div>
<p style="margin-top: 100px; text-align: center; font-size: 75%;"><a href="../resize.zip">Download the files (resize.zip)</a>
</p>
<script src="resize.js"></script>
</body>
</head>
</html>
Javascript:
function changemysize(myvalue) {
var div = document.getElementById("mymain");
div.style.fontSize = myvalue + "px";
}
步骤:
- 在 css 文件中定义一个类以放大字体大小。
- 在 li 的点击上调用函数
- 让函数为您的 html 正文添加/删除相应的类
document.body.classList.add('nameOfTheClassWithFontSize');
参考:更改整个页面内容的文本字体大小
对于使用 jQuery 的 HTML:$('body').css('font-size', '12px');
您可以传递所需的大小以增加/减少等。
相关文章:
- 用纯Javascript调整HTML5画布及其内容的大小
- JavaScript调整iFrame大小-适用于Firefox/IE,但不适用于Chrome
- Javascript调整所有图像的大小
- 使用Javascript调整图像大小,使其适合视口
- JavaScript 调整 iframe 的大小,但 iframe 中的元素具有相对大小
- 如何使用javascript调整此css对象
- 通过 JavaScript 调整 iFrame 内容的大小
- 使用 Javascript 调整字母大小
- WebView Android 和 JavaScript 调整大小
- 使用 Javascript 调整图像大小
- Javascript 调整背景图像的大小,但图像首先加载全尺寸 - 任何修复
- Javascript:调整base64图像的大小并以非异步方式返回字符串
- 使用 javascript 调整多个图像的大小
- 根据原始图像高度使用 Photoshop 和 JavaScript 调整条件图像大小
- JavaScript 调整函数输入变量
- 使用 javascript 调整网页的字体
- 将图像大小调整为使用 Javascript 调整窗口大小 - 在 Chrome 中不起作用
- 使用 JavaScript 调整图像大小
- 使用Google饼图(快速javascript调整)不断显示工具提示
- 使用Javascript调整绝对定位元素的大小