2

我想创建一个地方来输入文本,如输入或元素textareadiv但我不知道。

请告诉我。

我也希望div当点击它的光标成为 Blinker 时,就像输入的意思一样。

4

3 回答 3

3

以下是您正在寻找的内容。

HTML

<div id="editable" contentEditable="true"></div>

CSS(不是必需的,只是为了让 DIV 看起来像输入框)

#editable{
    border: 1px solid black;
    height: 100px;
    width: 400px;
}

工作演示

注意:请参阅 Aditya 对浏览器兼容性的回答。如果您想支持该列表之外的任何浏览器,请不要使用它。

于 2013-08-17T05:17:25.617 回答
0

看看这是不是你想要的:http: //jsbin.com/eqEPAci/1/edit

CSS:

.styles{
        height:30px;
    width:286px;
    -moz-border-radius: 4px;
    -webkit-border-radius: 4px;
    border-radius: 4px;
    -moz-background-clip: padding;
    -webkit-background-clip: padding-box;
    background-clip: padding-box;
    border: 1px solid #5E5E5E;
    padding:0px 5px;
        background-color: #000000;
        color:#BFBFBF;
        outline: none;
        input-align: center;
}

.abs-centered {
  margin: auto;
  position: absolute;
  bottom: 0;
  left: 0;
  top: 0;
  right: 0;
}

#actual-input{
  height:26px;
  padding:0px;
  width:100%;
  color:#fff;
  background-color:transparent;
  border:0px;
  outline-style:none;
}

HTML:

<!DOCTYPE html>
<html>
<head>
<meta charset=utf-8 />
<title>JS Bin</title>
</head>
<body bgcolor="#25383C">
  <div class="styles abs-centered">
    <input id="actual-input" name="name" type="password" placeholder="Password" autocomplete="off"/>
  </div>
</body>
</html>

选择:

<div contentEditable></div>

浏览器兼容性

于 2013-08-17T05:17:04.400 回答
0

使用contentEditable="true"div 属性

像这样 :

<div contentEditable="true"></div>

演示小提琴

但请注意这是HTML5,旧浏览器不支持它

于 2013-08-17T05:17:40.503 回答