我需要在输入字段中放置一个长占位符文本.
但是,由于文本较长,占位符将被删除.
<script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <label for="password"> <input id="password" name="user[password]" placeholder="Password (at least 8 letters,numbers,or punctuation marks)" size="30" type="password"> </label>
解决方法
input{ height:50px; } ::-webkit-input-placeholder { /* Chrome/Opera/Safari */ white-space:pre-line; position:relative; top:-7px; } ::-moz-placeholder { /* Firefox 19+ */ white-space:pre-line; position:relative; top:-7px; } :-ms-input-placeholder { /* IE 10+ */ white-space:pre-line; position:relative; top:-7px; } :-moz-placeholder { /* Firefox 18- */ white-space:pre-line; position:relative; top:-7px; }
<script src="https://ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script> <script src="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/js/bootstrap.min.js" integrity="sha384-Tc5IQib027qvyjSMfHjOMaLkfuWVxZxUPnCJA7l2mCWNIpG9mGCD8wGNIcPD7Txa" crossorigin="anonymous"></script> <link href="https://maxcdn.bootstrapcdn.com/bootstrap/3.3.7/css/bootstrap.min.css" rel="stylesheet" integrity="sha384-BVYiiSIFeK1dGmJRAkycuHAHRg32OmUcww7on3RYdg4Va+PmSTsz/K68vbdEjh4u" crossorigin="anonymous"> <label for="password"> <input id="password" name="user[password]" placeholder="Password (at least 8 letters,or punctuation marks)" size="30" type="password"> </label>