To create text areas in HTML, you use the <textarea></textarea> element. It's a block-level element used for multi-line text input, commonly seen in forms where users need to enter longer content like comments or messages.

Basic Syntax of <textarea></textarea>

The <textarea></textarea> tag is straightforward to use. You just need to place it inside a form and optionally define attributes like rows, cols, name, and placeholder.

Here's a basic example:

 <textarea name="message" rows="5" cols="30" placeholder="Enter your message here..."></textarea>

This creates a text area that's 5 rows high and 30 columns wide. The name attribute is important if you're submitting the form data somewhere, and the placeholder gives users a hint about what to write.

Commonly Used Attributes

There are several attributes you can use with <textarea> to control its behavior:

• rows : defines how many lines tall the text area should be.
• cols : sets the number of characters wide.
• placeholder : displays light text as a guide before the user types.
• required : makes the field mandatory.
• readonly or disabled : prevents editing under certain conditions.

You don't always have to specify rows and cols — you can also use CSS to size the text area more precisely.

Styling <textarea> with CSS

While the default look of a <textarea> works fine, you might want to make it match your site's design. You can style it using standard CSS properties like width, height, padding, and borders.

For example:

 textarea {
  width: 100%;
  padding: 10px;
  border: 1px solid #ccc;
  resize: vertical; /* allows users to resize vertically only */
}

This helps create a cleaner, more consistent appearance across different browsers. Also, using resize: none; will prevent users from resizing the box if needed.

Handling Form Submission

When a form containing a <textarea> is submitted, the content entered by the user is sent along with the form data. Make sure the name attribute is set so the backend can identify which data belongs to which field.

If you're handling this on the front end with JavaScript, you can access the value like this:

 const message = document.querySelector('textarea').value;
console.log(message);

This is useful for validation or dynamic updates before sending the data elsewhere.

基本上就這些。
Creating a text area in HTML is simple with the <textarea></textarea> element. You can adjust its size, add helpful hints, style it with CSS, and handle the data when the form is submitted. Just remember to give it a name and consider using rows , cols , or CSS to control its appearance.

以上是如何使用元素在HTML中創建文本區域？的詳細內容。更多資訊請關注PHP中文網其他相關文章！