Mais de 1 linha em <Input type=”textarea” />

Mais de 1 linha em <Input type=”textarea” />

Os formulários são um elemento básico e importante da página HTML que geralmente é usada para obter a entrada do usuário. Normalmente, um formulário HTML consiste em uma textarea, no botão Enviar, um rádio e uma caixa de seleção. Use o tipo de entrada apropriado se o usuário desejar os campos de formulário para aceitar números de telefone, endereços de email e outros dados. No entanto, há ocasiões em que os usuários precisam preencher formulários com mais informações, como o campo de texto de descrição, para o qual a textarea deve ser maior que uma linha.

Este post explica:

  • Método 1: Como adicionar mais de uma linha em ""?
  • Método 2: Como adicionar mais de uma linha na tag ""?

Método 1: Como adicionar mais de uma linha em ""?

Para adicionar mais de uma linha em “”Tipo de elemento“Textarea”, Siga o procedimento abaixo do ritmo.

Etapa 1: Adicionar cabeçalho

Primeiro, utilize qualquer tag de cabeçalho

para

Para adicionar um título. Por exemplo, o “

”A tag é usada para adicionar um título de nível um.

Etapa 2: Crie um elemento "div"

Em seguida, crie um “div”Elemento com a ajuda do“" marcação. Além disso, insira um “aula”Atributo e atribua um valor“Principal-Div”.

Etapa 3: Insira a área de texto

Depois disso, insira um “”Tag junto com os seguintes atributos:

  • ““tipo”Atributo define o tipo de“" elemento. Se o “tipo”O atributo não está determinado, então“texto”É definido como o valor padrão.
  • ““linhas”É usado para especificar a altura de uma área de texto visível nas linhas.
  • ““cols”É usado para definir a largura da área de texto:

Insira o texto na textarea



Você pode ver que a textarea foi criada que pode aceitar texto de várias linhas:

Etapa 4: Estilo “H1” título

Acesse o cabeçalho por nome da tag e aplique as propriedades CSS abaixo codificadas:

H1
estilo de fonte: oblíquo;
Cor: RGB (231, 173, 14);
Alinhamento de texto: centro;

Aqui, "estilo de fonte”É usado para estilizar o texto do cabeçalho,“cor”Especifica a cor do texto e o“alinhamento de texto”Define o alinhamento do texto como um centro.

Etapa 5: Elemento de estilo “div”

Primeiro, acesse o “div”Elemento usando a classe associada“.Principal-Div”E aplique as seguintes propriedades:

.main-div
estilo de fronteira: duplo;
cor de borda: RGB (2, 187, 233);
Alinhamento de texto: centro;
margem: 40px;
preenchimento: 50px;
Background-Color: Bisque;

Aqui está a descrição das propriedades acima codificadas:

  • ““estilo de borda”É usado para estilizar a fronteira.
  • ““Cor da borda”Propriedade aloca uma cor para uma borda definida.
  • ““margemA propriedade determina o lado externo do espaço em branco do limite do elemento.
  • ““preenchimento”Especifica o espaço em torno do conteúdo do elemento.
  • ““cor de fundo”Define a cor no fundo do elemento.

Saída

Método 2: Como adicionar mais de uma linha na tag ""?

Como o "”Elemento, o html“”Também é usado para especificar a área de texto em um documento HTML. Para especificar o “”De mais de uma linha, siga as instruções dadas.

Etapa 1: Adicione a área de texto

Siga o código da seção acima e adicione o “”Elemento em vez do“" elemento.

Além disso, adicione “linhas" e "cols" atributos:

Insira o texto na textarea




Saída

Observação: Para estilizar o “”Elemento através do CSS, siga o primeiro método.

Conclusão

Para adicionar mais de uma linha em html “”Tipo de elemento“Textarea”, Os usuários podem utilizar o“linhas" e "cols" atributos. Para esse fim, primeiro, adicione o “”Elemento junto com o tipo“Textarea”Atributo. Então, utilize o “linhas" e "cols”Atributo para aceitar a entrada de texto de várias linhas na área de texto. Este tutorial demonstrou os métodos para adicionar mais de uma linha na área de texto.