Question

我希望我的文字输入区域更大，但左上角有占位符文字。我该如何做到这一点？

<form name="myForm" class="infocontent">
   <input data-role="none" type="email" class="inputEmail required" name="email" placeholder="EMAIL"/> </br></br>
   <input data-role="none" type="text" class="inputMessage messageHeight required" name="message"  placeholder="MESSAGE" style="width:400px; height:100px;"/> </br> </br>

   <div id="load"></div>
   <input data-role="none" type="submit" name="submit" class="submit" value="submit"/>
</form>

Answer 1

您可以使用伪元素和css执行此操作，但您必须为每个浏览器执行一次：

＆＃13;

::-webkit-input-placeholder { /* WebKit browsers */

    position: absolute; top: 0; left: 0;
    position:0 0;
    height: 100px;
    width:400px;
}
:-moz-placeholder { /* Mozilla Firefox 4 to 18 */

    position: absolute; top: 0; left: 0;
    position:0 0;
    height: 100px;
    width:400px;
}
::-moz-placeholder { /* Mozilla Firefox 19+ */

    position: absolute; top: 0; left: 0;
    position:0 0;
    height: 100px;
    width:400px;
}
:-ms-input-placeholder { /* Internet Explorer 10+ */

    position: absolute; top: 0; left: 0;
    position:0 0;
    height: 100px;
    width:400px;
}

＆＃13;

<form name="myForm" class="infocontent">
        <input data-role="none" type="email" class="inputEmail required" name="email" placeholder="EMAIL"/> </br></br>
          <input data-role="none" type="text" class="inputMessage messageHeight required" name="message"  placeholder="MESSAGE" style="width:400px; height:100px;"/> </br> </br>

           <div id="load"></div>
           <input data-role="none" type="submit" name="submit" class="submit" value="submit"/>
          </form>

＆＃13;

上面的示例将允许您使用CSS修改占位符代码。

HTML文本区域更改占位符的位置

1 个答案: