我们正在尝试用类似于 FAB.com 的心形 css 按钮替换添加到收藏夹按钮
创建心形CSS的代码是
这个网站
<!DOCTYPE html>
<html>
<head>
<title>Creating Heart using CSS3 </title>
<style type="text/css">
#heart {
position: relative;
width: 100px;
height: 90px;
}
#heart:before, #heart:after {
position: absolute;
content: "";
left: 50px;
top: 0;
width: 50px;
height: 80px;
background: red;
border-radius: 50px 50px 0 0;
-webkit-transform: rotate(-45deg);
-moz-transform: rotate(-45deg);
-ms-transform: rotate(-45deg);
-o-transform: rotate(-45deg);
transform: rotate(-45deg);
-webkit-transform-origin: 0 100%;
-moz-transform-origin: 0 100%;
-ms-transform-origin: 0 100%;
-o-transform-origin: 0 100%;
transform-origin: 0 100%;
}
#heart:after {
left: 0;
-webkit-transform: rotate(45deg);
-moz-transform: rotate(45deg);
-ms-transform: rotate(45deg);
-o-transform: rotate(45deg);
transform: rotate(45deg);
-webkit-transform-origin: 100% 100%;
-moz-transform-origin: 100% 100%;
-ms-transform-origin: 100% 100%;
-o-transform-origin: 100% 100%;
transform-origin :100% 100%;
}
</style>
</head>
HTML :
<body>
<div id="heart"></div>
</body>
</html>
现在让它成为可能,如果这个人将它设为最喜欢它,它会保持红色但没有翻转它只是心脏周围的红色边框。
最佳答案
关于php - 如何在opencart主题中创建一个带有翻转效果的心形按钮来替换添加到收藏夹,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/17297182/