在HTMLHelper中嵌套div

时间:2018-03-19 08:05:34

标签: html css asp.net-mvc

我正在尝试将一些内容集中在我创建的动画按钮中。实质上,我正在尝试使用HTMLActionLink实现下面的HTML。

是否可以在使用HTMLActionLink时将div嵌入链接内部?

是否可以在任何HTMLHelper中嵌套任何内容?

以下是样式表,如果有用的话:

.linkbox-button {
  cursor: pointer;
  width: 33%;
  height: 33%;
  border: 1px solid black;
  display: inline-block;
  background-size: cover;
  margin: 2px auto;
}

.linkbox-button-bl,
.linkbox-button-rd {
  font-variant: small-caps;
  font-style: italic;
  font-weight: bold;
  font-size: 2em;
  height: 100%;
  width: 0;
  transition: width 0.7s ease-out;
  overflow: hidden;
  display: inline-block;
}

.linkbox-button-content {
  margin-top: 25%;
}

.linkbox-button:hover .linkbox-button-rd,
.linkbox-button:hover .linkbox-button-bl {
  width: 100%;
}
<div class="linkbox-button" style="background-image:url(../../Images/General/coach.png)">
  <a href="#" class="linkbox-button-bl">
    <div class="linkbox-button-content">
      <p> hello </p>
    </div>
  </a>
</div>

我的意思是你也可以告诉我如何在不使用额外div D的情况下将内容集中在链接内部。这是我唯一能想到的,不会牺牲整个按钮作为链接。

我无法找到任何表明类似内容的资源,所以如果这是重复,我会道歉。

0 个答案:

没有答案