Мне нужно отобразить несколько кнопок, когда элемент находится в фокусе - PullRequest
Новая
       42

Мне нужно отобразить несколько кнопок, когда элемент находится в фокусе

0 голосов
/ 04 мая 2020

Я новичок в HTML и CSS, но не новичок в программировании. Я хочу знать, когда я помещаю элемент в фокус, могу ли я показать / показать несколько кнопок. Я использую PHP без JS и хотел бы знать, возможно ли это без JS. Есть две кнопки, одна из которых имеет имя класса time1, а другая time2. css отобразит первую кнопку, когда дата окажется в фокусе, но я должен нажать вкладку, чтобы отобразить вторую кнопку. Я хотел бы, чтобы обе кнопки отображались, когда дата находится в фокусе. 

section.calendar form label.day input.time1[type=button] {
  border: 10;
  opacity: 0;
  position: absolute;
  margin-top: 40px;
  left: -45px;
  width: 80px;
  height: 1px;
  padding: 0;
  outline: none;
  font-size: 16px;
  -webkit-transition: height .2s linear, opacity .2s linear, color .02s linear;
  transition: height .2s linear, opacity .2s linear, color .02s linear;
  color: #fff;
}
section.calendar form label.day input.time2[type=button] {
  border: 10;
  opacity: 0;
  position: absolute;
  margin-top: 50px;
  left: -45px;
  width: 80px;
  height: 1px;
  padding: 0;
  outline: none;
  font-size: 16px;
  -webkit-transition: height .2s linear, opacity .2s linear, color .02s linear;
  transition: height .2s linear, opacity .2s linear, color .02s linear;
  color: #fff;
}
section.calendar form label.day input[type=button]:focus {
  opacity: 1;
  height: 35px;
  padding: 10px 40px 10px;
  left: -45px;
  width: 150px;
  color: #29323f;
}

Календарь

...