Como fazer com que elementos HTML como pré e textarea removam barras de rolagem, ajustem automaticamente e adaptem a altura do conteúdo do texto

Pré e textarea em HTML podem exibir texto pré-formatado. ou seja, preserve espaços e novas linhas. Em vez de adicionar elementos HTML como <br> e &nbsp;

Quando o conteúdo de texto é pré-exibido, ele não será quebrado automaticamente. Você pode adicionar algum CSS para resolver este problema:

 <pre>ourjs isso é muito, muito, muito, muito, muito, muito, muito, muito, muito conteúdo do logn.</pre>pre { word-wrap: break-word; ; cor de fundo: #f5f5f5; borda: 1px sólido #ccc;}

Textarea torna a altura adaptável à altura do conteúdo

Textarea também pode manter o formato do conteúdo como anterior, mas a altura do elemento é fixa e não pode ser ajustada com CSS. Neste momento, você pode usar o atributo scrollHeight.

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

Um preenchimento de 12px é adicionado aqui.

O texto acima é o que o editor apresenta a você como fazer com que elementos HTML como pré e área de texto removam a barra de rolagem, envolvam automaticamente o conteúdo do texto e se adaptem à altura do texto, espero que seja útil para você. qualquer dúvida, deixe-me uma mensagem e o editor responderá prontamente a todos. Gostaria também de agradecer a todos pelo apoio ao site de artes marciais VeVb!

Se você acha que este artigo é útil para você, fique à vontade para reimprimi-lo, indique a fonte, obrigado!