码迷,mamicode.com
首页 > Web开发 > 详细

[CSS]textarea设置下划线格式

时间:2017-01-06 16:46:10      阅读:6008      评论:0      收藏:0      [点我收藏+]

标签:如何   osi   设置   oct   pos   格式   实现   dex   top   

功能要求:
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设置下划线格式

标签:如何   osi   设置   oct   pos   格式   实现   dex   top   

原文地址:http://www.cnblogs.com/cztom/p/6256717.html

(3)
(3)
   
举报
评论 一句话评论(0
登录后才能评论!
© 2014 mamicode.com 版权所有  联系我们:gaon5@hotmail.com
迷上了代码!