怎样让pre和textarea等HTML元素去掉翻转条全自动换

日期:2021-01-19 类型:科技新闻 

关键词:建站平台有哪些,如何建设网站,免费自助建站,如何建立一个网站,网站建站的

HTML中pre和textarea能够显示信息预文件格式化的文字。即保存空格和换行符。而无须加上<br>和&nbsp;等HTML元向来加上换行和复印空格。

pre去掉翻转条

pre显示信息文字內容时是不容易全自动换行的,此时能够加上1些CSS来处理:

<pre>ourjs this is very very very very very very very very very very very very very very very logn contents.</pre>
pre {
    word-wrap: break-word;
    white-space: pre-wrap;

    padding: 9.5px;
    background-color: #f5f5f5;
    border: 1px solid #ccc;
}

textarea让高宽比自融入內容高宽比

textarea也能跟prev1样保存內容文件格式,可是元素高宽比是固定不动的,而且没法用CSS来调剂。此时能够依靠scrollHeight这个特性。

var textarea = document.getElementsByTagName('textarea')[0];
textarea.setAttribute('style','height:'+(textarea.scrollHeight + 12)+'px');

这里加了12px的padding。

总结

以上所述是网编给大伙儿详细介绍的怎样让pre和textarea等HTML元素去掉翻转条全自动换行自融入文字內容高宽比,期待对大伙儿有一定的协助,假如大伙儿有任何疑惑请给我留言,网编会立即回应大伙儿的。在此也十分谢谢大伙儿对脚本制作之家网站的适用!
假如你感觉本文对你有协助,欢迎转载,烦请注明出处,感谢!