annyang实现浏览器识别语音命令的效果-html代码-BFW代码库

annyang实现浏览器识别语音命令的效果

代码语言：html

所属分类：其他

代码描述：annyang实现浏览器识别语音命令的效果，请在https下或localhost中运行，并允许使用麦克风

下面为部分代码预览，完整代码请点击下载或在bfwstudio webide中打开

<!DOCTYPE html>
<html lang="en">
<head>
<meta charset="UTF-8">

<style>
* {
  -webkit-user-select: none;
     -moz-user-select: none;
      -ms-user-select: none;
          user-select: none;
}

.p-text {
  color: #fffffd;
  font-family: Helvetica, Arial, sans-serif;
  font-size: 0.55rem;
  letter-spacing: 2px;
  line-height: 1.5;
  text-align: center;
  text-transform: lowercase;
  -webkit-tap-highlight-color: rgba(0, 0, 0, 0);
}

.p-flex-hzt-center {
  display: -webkit-box;
  display: flex;
  -webkit-box-pack: center;
          justify-content: center;
}

body {
  height: 100vh;
  background-color: hotpink;
  margin: 0;
  padding: 0;
  overflow: hidden;
  position: relative;
}

.tooltip {
  width: 100%;
  position: absolute;
  bottom: 26px;
  left: 0;
  z-index: 90;
}
.tooltip:focus .tooltip__title, .tooltip:hover .tooltip__title {
  color: hotpink;
  text-transform: uppercase;
}
.tooltip:focus .tooltip__txt, .tooltip:hover .tooltip__txt {
  display: block;
  text-transform: none;
}
.to.........完整代码请登录后点击上方下载按钮下载查看