功能要求:
1:如何实现在多行文本框textarea里面每一行下面都有一条横线  
2:textarea文本框里面有一段不能删掉

实现方法:
横线用背景图片来做,不动的文字用浮动层+给textarea增加text-indent来实现缩进。

源代码如下

<!DOCTYPE html>
<html lang="zh">
<head>
  <meta http-equiv="Content-Type" content="text/html; charset=utf-8"/>
  <meta charset="utf-8" />
<title>Textarea设置下划线格式</title>
  <style type="text/css">
  .input{position:relative}
  .word{position:absolute;line-height:20px;left:0px;top:1px;z-index:10;background:#fff}
  .input textarea{border:none; text-indent:75px;line-height:20px;background:url(http://www.w3dev.cn/eg/linebg.gif) repeat;overflow:auto}
  </style>
</head>
<body>
  <div class="input">
    <div class="word">护理措施:</div>
<textarea class="input" rows="5" cols="50"></textarea>
  </div>
</body>
</html>

  

[CSS]textarea设置下划线格式的更多相关文章

  1. 转:【iOS开发每日小笔记(十一)】iOS8更新留下的“坑” NSAttributedString设置下划线 NSUnderlineStyleAttributeName 属性必须为NSNumber

    http://www.bubuko.com/infodetail-382485.html 标签:des   class   style   代码   html   使用   问题   文件   数据 ...

  2. Android开发 ---SQLite数据库,lock文件,结果集游标,适配器,安全退出,给连接设置下划线,编辑器,投影,ContentValues存储,DbHelper,activity栈

    目录截图: 1.activity_main.xml 主界面效果: <?xml version="1.0" encoding="utf-8"?> &l ...

  3. 不可思议的纯CSS导航栏下划线跟随效果

    先上张图,如何使用纯 CSS 制作如下效果? 在继续阅读下文之前,你可以先缓一缓.尝试思考一下上面的效果或者动手尝试一下,不借助 JS ,能否巧妙的实现上述效果. OK,继续.这个效果是我在业务开发的 ...

  4. [Android] TabLayout设置下划线(Indicator)宽度

    在使用TabLayout的过程中,为每个标签添加一个 下划线,但发现每个下划线的 宽度 都是一样的,例如会如下显示 这样很难看,所以必须进行调整后的效果如下: 看,这样不是非常和谐啦!~~ 实现方法很 ...

  5. 纯css导航栏下划线

    .nav-underline > *{/* 指定容器,里面可以是li.span等多样化的元素 */ display: inline-block; margin: -3px; padding: 1 ...

  6. CSS改变字体下划线颜色

    下图是网页中一个非常普通的列表. watermark/2/text/aHR0cDovL2Jsb2cuY3Nkbi5uZXQvQXVndXMzMzQ0/font/5a6L5L2T/fontsize/40 ...

  7. android实现对导航Tab设置下划线选中效果

    技术人员核心竞争力还是技术啊.努力提高各种实现效果.加油哦! 直接看效果.此linearLayout只有两个Button ,当选中Button1,Button1有个下划线选中效果.当选中Buton2, ...

  8. Android中Tablayout设置下划线宽度 和 dp和px之间进行相互转换

    开发中遇到了一个问题,Tablayout设置下换线长度,看了点资料,分享给大家. 效果图:               直接贴代码(要在tabLayout添加完所有的tab后调用) public vo ...

  9. CSS制作hover下划线动画

    .demo1{ position: relative; text-decoration: none; font-size: 20px; color: #333; } .demo1:before{ co ...

随机推荐

  1. vba 相关

    返回当前默认文件路径: Application.DefaultFilePath 返回应用程序完整路径 Application.Path 返回当前工作薄的路径 ThisWorkbook.Path App ...

  2. React学习笔记-5-初始化阶段介绍

    初始化阶段可以使用的函数:getDefaultProps:只调用一次,实例之间共享引用.只有在组件的第一个实例被初始化的时候,才会调用他,然后react会把这个函数的返回结果保存起来,从第二个实例开始 ...

  3. tomcat启动报错No UserDatabase component found under key UserDatabase

    非正常关机,造成了tomcat下conf文件中的tomcat-user.xml文件异常,copy一个新的tomcat-user.xml覆盖就可以了.

  4. Java中的URL类

    Java的网络类可以让你通过网络或者远程连接来实现应用.而且,这个平台现在已经可 以对国际互联网以及URL资源进行访问了.Java的URL类可以让访问网络资源就像是访问你本地的文件夹一样方便快捷.我们 ...

  5. 一个 Q-learning 算法的简明教程

    本文是对 http://mnemstudio.org/path-finding-q-learning-tutorial.htm 的翻译,共分两部分,第一部分为中文翻译,第二部分为英文原文.翻译时为方便 ...

  6. PDA手持扫描资产标签,盘点完成后将数据上传到PC端,固定资产系统查看盘点结果

    固定资产管理系统介绍: 致力于研发条码技术.集成条码系统的专业性公司,针对客户的不同需求,提供一站式的企业条码系统解决方案:包括功能强大的软件系统.安全可靠的无线网络.坚固耐用的硬件系统.灵活易用的管 ...

  7. [spring源码学习]七、IOC源码-Context

    一.代码实例 如之前介绍的,spring中ioc是它最为核心的模块,前边花了大量时间分析spring的bean工厂和他如何生成bean,可是在我们实际应用中,很少直接使用beanFactory,因为s ...

  8. 移动web资源整理

    [原]移动web资源整理 2013年初接触移动端,简单做下总结,首先了解下移动web带来的问题 设备更新换代快--低端机遗留下问题.高端机带来新挑战 浏览器厂商不统一--兼容问题多 网络更复杂--弱网 ...

  9. 关于CSV文件 Excel打开乱码问题的解决方案

    近日写java程序中,将数据输出到csv文件中,发现Excel打开之后,中文均为乱码 于是寻找解决方案,发现最简单的方式还是如此了 1. 将输出的csv文件用记事本打开 2. 另存为将文件编码格式改为 ...

  10. 迎战Meta 2,微软新专利有望解决Hololens视场角野窄问题

    上周,微软HoloLens的竞争对手AR眼镜Meta 2正式发货,微软是该急了.我们知道Meta 2不仅在价格上比HoloLens便宜,而且在性能上也不弱,Meta2的可视角度达到90度,比HoloL ...