javascript - 如何使用 javascript 更改字体、颜色、大小...

标签 javascript

我有一个文本区域,现在想为用户提供更改字体大小、样式等的功能。当我单击按钮时,它应该弹出字体对话框。

    <html>
    <body>
    <form name="abc">
    <textarea name="text">loaded text here</textarea>
    <input type="button" onClick=""> chnage font
    </form>
    </body>
    </html>

我在http://www.smokyhosts.com/forums/showthread.php?t=740中找到了这个代码作者:Lixas,但当我更改文本大小时,它会更改文本框的高度和宽度

<html>
<head>
    <style type="text/css">
        body, td, tg, input, select {
            font-family: Verdana;
            font-size: 10px;
        }

</style>
</head>
<body onload="initPosition(document.forms[0].txtLayoutViewer)">
<form>
Change Font Size: 
<select onchange="this.form.txtLayoutViewer.style.fontSize = this.options[this.selectedIndex].value; initPosition(this.form.txtLayoutViewer);">
<option value="10">10px</option>
<option value="12">12px</option>
<option value="14">14px</option>
<option value="16">16px</option>
<option value="18">18px</option>
<option value="20">20px</option>
<option value="24">24px</option>
<option value="36">36px</option>
</select>


<textarea name="txtLayoutViewer" rows="15" cols="75" wrap="off">Any text u want to see how it changes.</textarea>
</form></body></html>

感谢 Christian textarea 现在没有改变...使用类似的方法是否可以更改文本字体样式(如粗体、斜体、常规、粗体斜体)和字体(times new roman、lucida 手写)??? ?

提前致谢

-subanki

最佳答案

为了防止第二个示例中的大小发生变化,您需要设置宽度和高度,而不是行和列。

<textarea name="txtLayoutViewer" style="width:500px;height:300px"
                      wrap="off">
  Any text u want to see how it changes.
</textarea>

使用适当的 CSS 会让它变得更干净。

关于javascript - 如何使用 javascript 更改字体、颜色、大小...,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/3227118/

相关文章:

javascript - input[file] 包裹在 Label 内时不可聚焦

javascript - Jest 中的 'describe' 和 'test' 有什么区别?

javascript - 如何强制容器始终换行成两行?

javascript - 回调/复用 channel 的复用参数

Javascript 命名空间 + onchange = 不可能?

javascript - 将 Ember.js 与 DDP/Meteor 后端结合使用

javascript - 当 slider handle 移动时如何在 Foundation 6 范围 slider 上添加类

javascript - 带有 this/bind 的 JS 原型(prototype)范围

javascript - 动态 anchor 上的 jquery .click() 事件不起作用

javascript - 为未标记的文本添加样式