如何仅增加文字大小？
[英]How to Increase text size only?
问题描述
i have a code by which i increase the size of text which is in text area and i am able to do this by given code but here is one problem with me that when increase size of text it increase also the size of text area and i do not want this and also want to make text area scrollable 
我有一个代码，我通过它增加文本区域中的文本的大小，我能够通过给定的代码执行此操作，但这是我的一个问题，当增加文本的大小时，它也增加了文本区域的大小和我不想要这个，也想让文本区域可滚动
code is given below: 代码如下：
<HTML>
<head>
<head>
<script src="http://code.jquery.com/jquery-1.9.1.js"></script>
<script>
$(function () {
$('select[name="font"]').on('change', function () {
$('textarea').css('font-family', this.value);
});
});
</script>
</head>
<body>
Select Programming font:
<select name="font">
<option value="arial">arial black</option>
<option value="tahoma">tahoma</option>
<option value="times new roman">times new roman</option>
<option value="calibri">calibri</option>
</select>
<select onchange="$('#txt').css('font-size', event.target.value + 'px')">
<option value="10">10</option>
<option value="20">20</option>
<option value="30">30</option>
</select>
<br>EnterValue:
<textarea id="txt" rows="4" cols="50">Test Test</textarea>
</body>
</html>
4 个解决方案
解决方案1
2 2014-03-05 12:56:04
Give your textarea specific dimensions using CSS. 使用CSS为您的textarea提供特定尺寸。 You can then set the overflow property to auto, which will make the browser automatically render a scrollbar where it is appropriate: 然后，您可以将overflow属性设置为auto，这将使浏览器自动呈现适当的滚动条：
#txt{
height:40px;
width:200px;
overflow:auto;
}
解决方案2
0 已采纳 2014-03-05 12:54:59
use css resize:none;overflow:auto;width:100px;height:50px with textarea 使用css resize:none;overflow:auto;width:100px;height:50px with textarea
<textarea id="txt" rows="4" cols="50" style="resize:none;overflow:auto;width:300px;height:50px">Test Test</textarea>
Demo : http://jsfiddle.net/9BGT2/ 演示： http ： //jsfiddle.net/9BGT2/
解决方案3
0 2014-03-05 12:55:57
<textarea id="txt" rows="4" cols="50" style="width:400px;height:100px">Test Test</textarea>
解决方案4
0 2014-03-05 13:03:15
You can get the width and height of textarea before changing your font size then set it back to the textarea : 您可以在更改字体大小之前获取textarea的宽度和高度，然后将其设置回textarea ：
$(function () {
var width = $('textarea').width(),
height = $('textarea').height();
$('select[name="font"]').on('change', function () {
$('textarea').css('font-family', this.value);
$('textarea').width(width);
$('textarea').height(height);
}).change();
});
This solution does not require you to set fixed width and height for your textarea 此解决方案不需要您为textarea设置固定的宽度和高度
声明:本站的技术帖子网页，遵循CC BY-SA 4.0协议，如果您需要转载，请注明本站网址或者原文地址。任何问题请咨询:yoyou2525@163.com.