功能要求：
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. 浅谈display:flex

    display:flex 意思是弹性布局 首先flex的出现是为了解决哪些问题呢? 一.页面行排列布局 像此图左右两个div一排显示 可以用浮动的布局方式 html部分 css部分 这种布局有两个缺点 ...

  2. iOS打包ipa给客户测试流程

    IOS项目开发的过程中经常会用到一个测试的问题,特别是外包的项目,客户拿了那么多钱,看不到产品时时的进度说不过去,而且UI和功能是否和符合用户需求这个很重要,需要客户的认同. 所以就需要时时给开发中的 ...

  3. 关于安装CentOS 7 的注意事项

    1.安装VMware Workstation 2.安装CentOS的时候选择GNOME桌面 3.联网设置, VMWare Network Apapter VMnet8 设置IP4 自动获取IP地址,“ ...

  4. UWP学习记录11-设计和UI

    UWP学习记录11-设计和UI 1.输入和设备 通用 Windows 平台 (UWP) 中的用户交互组合了输入和输出源(例如鼠标.键盘.笔.触摸.触摸板.语音.Cortana.控制器.手势.注视等)以 ...

  5. Unity4、Unity5移动平台多线程渲染在部分安卓手机上会造成闪退

    你看到的crash堆栈可能是这样的: SIGSEGV(SEGV_MAPERR)   #00  pc 0001276c                          /system/lib/libc ...

  6. python 学习第二天

    由于换了博客,第一篇没有在博客园写,写在了开源中国上,链接地址为http://my.oschina.net/u/254063/blog/719289,大家有兴趣可以看看 一, python 数据类型 ...

  7. 【转载】给那些想多学习，多进步的Domino初学者

    在这个社区里面,包括QQ技术群里面混了很久了.遇到了很多Domino初学者,也认识了很多致力于Domino这个技术领域的朋友,很开心.很久没有写长篇大论给大家了.我要把一些想法写出来,共大家参考.讨论 ...

  8. 转：Delphi 函数大全

    Delphi 函数大全 - xiucaiyao的专栏 - 博客频道 - CSDN.NEThttp://blog.csdn.net/xiucaiyao/article/details/4544039 名 ...

  9. solr 添加索引

    添加索引模板: <add> <doc> <field name="employeeId">05991</field> <fie ...

  10. 基于Proteus仿真的Arduino学习（2）——LED点阵探究A（LED点阵基础）

    一.前言: 随着LED的普及,以LED点阵为基础的显示设置层出不穷.例如,公交车的线路提示牌.高速公路的信息提示牌,安装在大楼上的广告屏幕等.下面,我们将由简单到复杂地探索各种LED点阵的使用方法,同 ...