href _self不适用于修改的<button>

时间:2019-01-09 17:48:02

标签: html css

在修改后的<button>周围有一个href,应该在同一窗口中打开链接,但是不会发生。打开此链接的唯一方法是改为添加target="_blank"如何解决?

.centered {
  position: absolute;
  top: 50%;
  left: 50%;
  transform: translate(-50%, -50%) 
}

button.circle {
  width: 65vh;
  height: 65vh;
  border: 0;
  background-color: transparent;
}

button.circle::after {
  z-index: -1;
  position: absolute;
  top: 0;
  left: 0;
  right: 0;
  bottom: 0;
  content: '';
  display: block;
  background: teal;
  border-radius: 100%;
  animation: breathe 4.5s ease infinite alternate running;
}

@keyframes breathe {
  from { transform: scale(1); }
  to { transform: scale(1.4); }
}
<a href="https://www.w3schools.com" target="_self"><button class="circle centered">Click me</button></a>

1 个答案:

答案 0 :(得分:1)

根据HTML5规范document,将按钮嵌套到锚标记中是无效的。

以下内容不能嵌套在锚标记中:

<a>

<audio> (if the controls attribute is present)

<button>

<details>

<embed>

<iframe>

<img> (if the usemap attribute is present)

<input> (if the type attribute is not in the hidden state)

<keygen>

<label>

<menu> (if the type attribute is in the toolbar state)

<object> (if the usemap attribute is present)

<select>

<textarea>

<video> (if the controls attribute is present)