小编Tar*_*tel的帖子

导航栏悬停效果-CSS

我正在导航栏上。我上传的图像上有一个红色圆圈。我必须做那个形状。我该怎么做？如何在一个单一的形状中创建这种形状div

这是我的代码：

<!DOCTYPE html>
<html>
<head>
	<title>CSS Shape</title>
	<style>

.triangletwo {
  width:100px;
  height:100px;
  display:inherit;
  opacity:0;
  transition:all 1s ease-in-out;
  -webkit-transition:all 1s ease-in-out;
  clip-path: polygon(100% 0, 0 0%, 50% 80%);
	}
</style>
</head>
<body>
   <div style="width: 200px; height: 200px; overflow: hidden; margin: 0px; display: inline-block; clip-path: polygon(100% 0, 0 0%, 50% 80%);">
   </div>

   <div style="width: 100px; height: 100px; overflow: hidden; background: #6d74a3; margin-left:-100px; display: inline-block;clip-path: polygon(50% 0, 0 80%, 100% 80%);">
   </div>
   <div style="width: 100px; height: 100px; overflow: hidden; background: #6d74a3; …

Run Code Online (Sandbox Code Playgroud)

html javascript css html5-canvas

Tar*_*tel

lucky-day

1
推荐指数

1
解决办法

65
查看次数