Question

如果我们使用输入日期标签，它将显示此格式。

我只想在输入的日期中隐藏“ dd” 。所以我这样做了。它消失了。

input::-webkit-datetime-edit-day-field{
    display: none;
}

问题

它在那里显示了额外的破折号“ /” 符号。我也想删除它。

我这样使用了css的第一个孩子，并尝试定位第一个孩子，但是它不起作用。

input::-webkit-datetime-edit-fields-wrapper ::-webkit-datetime-edit-text:first-child {
    display: none;
}

有任何隐藏的想法吗？ https://jsfiddle.net/mdoty2g9/

Answer 1

Finlay我找到了解决方法。我完全隐藏了“ /”。

input::-webkit-datetime-edit-text{
 display: none;
}

然后以这种方式使用persudo css放置在输入中。

input{
 position: relative;
}

input:after {
 content: "/";
 position: absolute;
 left: 60px;
 top: 1px;
}

问题解决了！

Answer 2

<!DOCTYPE html>
<html>
<body>

<h1>Show a Date Control</h1>

<form action="/action_page.php">
  <label for="birthday">Birthday:</label>
  <input type="date" id="birthday" name="birthday">
  <input type="submit">
</form>

<p><strong>Note:</strong> type="date" is not supported in Safari or Internet Explorer 11 (or earlier).</p>

</body>
</html>

样式占位符文本-输入日期标签

2 个答案: