功能要求：
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. css3 自定义字体 @font-face

    CSS3 @font-face 规则 在 CSS3 之前,web 设计师必须使用已在用户计算机上安装好的字体. 通过 CSS3,web 设计师可以使用他们喜欢的任意字体. 当您您找到或购买到希望使用的 ...

  2. hbase 遇到过的问题

    1:下面这个错误是因为我zookeeper忘了启动了,启动你的zookeeper,重新启动下你的hbase hbase(main):002:0> list TABLE ERROR: Can't ...

  3. 手机开发中的AP与BP的概念

    转自:http://blog.csdn.net/macong01/article/details/15504611 手机的AP和BP: AP:ApplicationProcessor,即应用芯片 BP ...

  4. android系统release签名

    转自:http://blog.csdn.net/yangkai6121/article/details/38682321 为什么需要给Android系统签个名才能进行CTS认证呢?原来我们通过make ...

  5. 重写AgileEAS.NET SOA 中间件平台账号密码的加密算法

    一.平台简介 AgileEAS.NET SOA 中间件平台是一款基于基于敏捷并行开发思想和Microsoft .Net构件(组件)开发技术而构建的一个快速开发应用平台.用于帮助中小型软件企业建立一条适 ...

  6. 如何托管ASP.NET Core应用到Windows Service中

    (此文章同时发表在本人微信公众号"dotNET开发经验谈",欢迎右边二维码来关注.) 题记:正在构思一个中间件的设计,考虑是否既可以使用最新的技术,也可以兼顾传统的部署模式.所以有 ...

  7. 【积累篇：他山之石，把玉攻】解决XP 系统 .Net Framework 4安装时出现严重错误 (0x80070643)

    第一步: 1.开始——运行——输入cmd——回车——在打开的窗口中输入net stop WuAuServ 2.开始——运行——输入%windir% 3.在打开的 的窗口中有个文件夹叫SoftwareD ...

  8. maven权威指南学习笔记（四）—— maven生命周期（lifecycle）

    定义: 生命周期是包含在一个项目构建中的一系列有序的阶段 举个例子来说就是maven 对一个工程进行: 验证(validate) -- 编译源码(compile) -- 编译测试源码(test-com ...

  9. POJ 2653 Pick-up sticks （线段相交）

    题意:给你n条线段依次放到二维平面上,问最后有哪些没与前面的线段相交,即它是顶上的线段 题解:数据弱,正向纯模拟可过 但是有一个陷阱:如果我们从后面向前枚举,找与前面哪些相交,再删除前面那些相交的线段 ...

  10. [spring源码学习]二、IOC源码——配置文件读取

    一.环境准备 对于学习源码来讲,拿到一大堆的代码,脑袋里肯定是嗡嗡的,所以从代码实例进行跟踪调试未尝不是一种好的办法,此处,我们准备了一个小例子: package com.zjl; public cl ...