淘先锋技术网

首页 1 2 3 4 5 6 7

现在很多人都知道了心代码,这是一种可以用html输出效果的代码。


/*以下是css代码*/
.heart {
  width: 50px;
  height: 50px;
  position: relative;
  margin: 50px auto;
  transform: rotate(45deg);
  box-shadow: 0px 20px 30px rgba(0, 0, 0, 0.1), 0px 35px 50px rgba(0, 0, 0, 0.05), 0px 10px 10px rgba(0, 0, 0, 0.1), inset 0px 0px 10px #ff3377;
}

.heart:before,
.heart:after {
  content: "";
  position: absolute;
  background: #ff3377;
}

.heart:before {
  width: 50px;
  height: 50px;
  top: -25px;
  left: 0;
  border-radius: 25px 25px 0 0;
}

.heart:after {
  width: 50px;
  height: 50px;
  top: 0;
  left: 25px;
  border-radius: 0 25px 25px 0;
}

心代码用html输出效果

上面是一段css代码,它的效果是画一个红色的心形。具体可以在html代码中使用如下:


<div class="heart"></div>

将上面的代码复制粘贴进自己的html文件中,就可以看到一个漂亮的红心了。