一个解决表单中的文字和文本区域(textarea)上对齐的方法
在进行表单布局的时候通常会遇到这样的情况

文本和textarea标签是底部对齐的
<p><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;
}
上面是html代码 实现方式就是在再添加一个文字包裹一样的的空标签,然后然真正包裹文字的标签绝对定位,父元素进行相对定位,这样空标签顶替了因绝对定位失去的文档流,绝对定位默认父元素是左上角这样就实现了顶部对齐了

实现代码如下:
<p class='pr'><em class='pa'>邮箱</em><em></em><textarea style='height:150px;width:540px;'></textarea></p>
注:pr和pa两个类分别表示相对定位和绝定位
一个解决表单中的文字和文本区域(textarea)上对齐的方法的更多相关文章
- [Swift通天遁地]二、表格表单-(12)设置表单文字对齐方式以及自适应高度的文本区域TextArea
★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★★➤微信公众号:山青咏芝(shanqingyongzhi)➤博客园地址:山青咏芝(https://www.cnblogs. ...
- 通达OA二次开发 工作流表单中关联查询另外一个工作流方法(源代码)
一个工作流表单中,怎样方便的查询相关的工作流表单内容.重复打开各个菜单必定须要造成多次点击浪费时间,切换也会带来思路的中断.这里通过js代码的方式把这个问题进行了解决. <style>&l ...
- jquery禁用form表单中的文本框
//禁用form表单中所有的input[文本框.复选框.单选框],select[下拉选],多行文本框[textarea] function disableForm(formId, isDisabled ...
- 如何在启用SharePoint浏览器功能的InfoPath 表单中添加托管代码以动态地加载并显示图片
InfoPath 的浏览器表单不支持加载并显示图片,当然在模板中可以插入图片,但是如果想显示数据库的一幅图片,或是动态加载一张图片就无能为力了. 基实这个问题可以通过在浏览器表单中使用: " ...
- 表单中Readonly和Disabled的区别(转载)
Readonly和Disabled是用在表单中的两个属性,它们都能够做到使用户不能够更改表单域中的内容.但是它们之间有着微小的差别,总结如下: Readonly只针对input(text / pass ...
- 表单中Readonly和Disabled的区别(转)
今天做form提交的时候,用到了disabled,form提交的时候怎么获取都是null,后来用hidden解决了这个问题,但是考虑到为什么,最后找到了原因,转载一篇文章,说明一下 原文:http:/ ...
- 【转载】表单中 Readonly 和 Disabled 的区别
今天写代码,遇到表单提交的问题,某个字段在不同的情况下,要传递不同的值进行赋值,试过一些方法都有些问题,后来请教前端同学,使用 disabled 这个属性终于搞定了问题,查到一篇讲解 readonly ...
- 关于表单中Readonly和Disabled
Readonly和Disabled是用在表单中的两个属性,它们都能够做到使用户不能够更改表单域中的内容.但是它们之间有着微小的差别,总结如下: Readonly只针对input(text / pass ...
- spring boot:单文件上传/多文件上传/表单中多个文件域上传(spring boot 2.3.2)
一,表单中有多个文件域时如何实现说明和文件的对应? 1,说明和文件对应 文件上传页面中,如果有多个文件域又有多个相对应的文件说明时, 文件和说明如何对应? 我们在表单中给对应的file变量和text变 ...
随机推荐
- 【总结】探索Newlife组件:服务代理利器XAgent的前世今生
本博客所有文章分类的总目录:http://www.cnblogs.com/asxinyu/p/4288836.html Newlife XCode组件相关文章目录:http://www.cn ...
- 后端码农谈前端(CSS篇)第三课:选择器
一.选择器 1.ID选择器: 语法:首先,ID 选择器前面有一个 # 号 - 也称为棋盘号或井号.请看下面的规则: *#intro {font-weight:bold;} 与类选择器一样,ID 选择器 ...
- Express框架使用以及数据库公共操作类整理(Win7下的NodeJs)
具体步骤: 1.安装开发工具WebStorm: 2.安装node/npm(下载地址:https://nodejs.org/download/)选择适合你的xxx.mis安装: 3.安装express框 ...
- Linux的学习--配置LNMP环境
最近,回到公司,发现电脑都换成linux系统了...很无力... 配置环境,跑起项目来就花了一天...额...在这里记录一下-- 系统是ubuntu 12.04. 一.安装nginx1:ubuntu因 ...
- nginx反向代理docker registry报”blob upload unknown"解决办法
问题症状:keepalived+nginx反向代理后端docker registry群集时,使用docker客户机向registry push镜像时出现 "blob upload unkno ...
- 坑人的微信新版支付(V3.3.6)
现在微支付的需求越来越多,最近刚接到一个需要微支付的项目,于是身为程序猿的我拿到最新的微信支付接口文档(3.3.6)就开始研究微信支付.本以为应该跟支付宝差不多的感觉结果被坑了.恕在下无能, ...
- ASP.NET MVC程序播放H.264视频
在这篇之前,Insus.NET不管是在ASP.NET还是ASP.NET MVC实现很多视频播放,你可以参考这篇链接:http://www.cnblogs.com/insus/category/4650 ...
- 点击页面任何位置隐藏div
<include file="Public:header" /> <style type="text/css"> table{width ...
- hibernate----1-1-----两表关联属性放在另一个表里面
package com.ij34.dao; import javax.persistence.*; @Entity @Table(name="Address_inf") publi ...
- 说说Java的内存
首先,我们来看一段程序内存溢出的代码: import java.util.ArrayList; import java.util.List; public class TestMemoryLeak { ...