form 中的textarea文字和文本域底部对齐

最新推荐文章于 2024-04-01 11:48:47 发布

前端娱乐圈

最新推荐文章于 2024-04-01 11:48:47 发布

阅读量2.1k

点赞数

CC 4.0 BY-SA版权

分类专栏：温故而知新文章标签： textare顶部对齐 form表单

本文链接：https://blog.youkuaiyun.com/weixin_43612234/article/details/87361020

温故而知新专栏收录该内容

6 篇文章

订阅专栏

本文介绍在网页设计中如何使表单中的Textarea元素与文本域底部对齐，提供了两种实现方法：通过浮动布局和使用定位技术，适用于前端开发者优化表单布局。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

form 中的textarea文字和文本域底部对齐

在这里插入图片描述

1.浮动；

用DIV布的局，你也可以用TABLE的td属性的vlign=top来设置 
<form name="form1" method="post" action=""> 
<div style="width:100px; float:left">对齐：</div> 
<div><textarea name="textarea" rows="10"></textarea></div>

2.定位

<p class='pr'><em class='pa'>邮箱</em><em></em><textarea style='height:150px;width:540px;'></textarea></p>

#content .form p em{
    display: inline-block;
    width:70px;
    text-align: right;
    margin-right: 20px;
}
注：pr和pa两个类分别表示相对定位和绝定位