进行日期时间本地css更改开发者社区

link管理

链接快照平台

输入网页链接，自动生成快照
标签化管理网页链接

相关文章推荐

聪明伶俐的人字拖 · 苹果手机怎么抠图换背景，人像抠图的方法和教程· 3 月前 ·

魁梧的排球 · python 自动化过滑动验证码 - CSDN文库· 3 月前 ·

八块腹肌的拖把 · 凤凰展翅欲飞翔，密探大兴新机场 —— ...· 5 月前 ·

小眼睛的火龙果 · 经济管理学院专业学位教育· 1 年前 ·

英俊的红酒 · How can I find my ...· 1 年前 ·

腾讯云

开发者社区

文档建议反馈控制台

首页 TVP

最新优惠活动

文章/答案/技术大牛

发布

<h1>Show a Date and Time Control</h1>
<form action="/action_page.php">
  <label for="birthdaytime">Birthday (date and time):</label>
  <input type="datetime-local" id="birthdaytime" name="birthdaytime">
  <input type="submit">
</form>

const handleClickIcon = (e) => {
  if (e.target.classList.contains('datetime-wrapper')) {
    console.log('Toggle calendar!');
document.querySelector('.datetime-wrapper')
  .addEventListener('click', handleClickIcon);

.as-console-wrapper { max-height: 4em !important; }
.datetime-wrapper {
  position: relative;
  padding: 0;
  margin: 0;
  width: max-content;
.datetime-wrapper input {
  padding: 0.5rem;
  border: thin solid grey;
  border-radius: 0.25rem;
/* adornment */
.datetime-wrapper::after {
  /* .fa-solid */
  font-family: "Font Awesome 6 Free";
  font-weight: 900;
  /* .fa-calendar-days:before */
  content: "\f073";
  /* custom */
  position: absolute;
  top: 0;
  right: 0.5rem;
  height: 2rem;
  line-height: 2rem;
  cursor: pointer;
}

<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.0/css/fontawesome.min.css" rel="stylesheet"/>
<link href="https://cdnjs.cloudflare.com/ajax/libs/font-awesome/6.1.0/css/solid.min.css" rel="stylesheet"/>

问 进行日期时间本地css更改 EN

回答 2

Stack Overflow用户