HTML文本框：将部分占位符文本设为粗体和下划线

Question

是否可以在输入中仅设置占位符文本的某个部分？我喜欢＆＃34;点击这里＆＃34;占位符文本的一部分用粗体和下划线标出。

1.5

感谢您的回答。

此致

麦迪

Answer 1

如果您使用label而不是占位符，则可以这样做。

var sp = document.getElementById('sp');
function hid(){
	sp.style.display = "none"
}
function vi(){
	if(!document.getElementById('vali').value){
		sp.style.display = "inline-block";
	}else{
		hid();
	}
}

label{
	position : relative
}
label>span{
	position : absolute;
	left : 2px;
}
input{
	position : relative;
	background : none;
}

<label>
<span id="sp"><b><u>click here</u></b> to choose...</span>
<input type = "text" id = "vali" onfocus = "hid();" onblur = "vi();">
</label>

Answer 2

在大多数浏览器中，它需要一些非标准的css规则才能相当一致。 https://css-tricks.com/almanac/selectors/p/placeholder/

＆＃13;

＆＃13;

::-webkit-input-placeholder {
  /* Chrome/Opera/Safari */
  font-weight: bold;
  text-decoration: underline;
}

::-moz-placeholder {
  /* Firefox 19+ */
  font-weight: bold;
  text-decoration: underline;
}

:-ms-input-placeholder {
  /* IE 10+ */
  font-weight: bold;
  text-decoration: underline;
}

:-moz-placeholder {
  /* Firefox 18- */
  font-weight: bold;
  text-decoration: underline;
}

input {
  width: 100%;
}

＆＃13;

<input type="text" class="input-text  hasDatepicker" name="wc_order_field_2563" id="wc_order_field_2563" placeholder="Click here to choose your pickup date*: (Tuesday - Saturday)" value="">

＆＃13;

＆＃13;

＆＃13;