css录音样式,css音频标签

微信小程序录音界面以及功能实现

pick一下最终效果，然后一步一步来。

先把界面效果做出来。

wxml

wxss

js赋值

这里我的录音按钮点击扩散效果用的是纯css实现，而上方progress是使用animation实现的。

相关问答

Q1: html实现录音和播放功能

1、首先新建一个HTML文档，如图所示。

2、然后在body标签里输入video标签。

3、接着在video标签内输入controls="controls"，如图所示。

4、然后在video标签里输入source，接着在source内输入src="medias/volcano.ogg"，如图所示。

5、然后在后面输入type="video/ogg"如图所示，然后在定义一个source标签。

6、在标签内输入src="medias/volcano.mp4" type="video/mp4"如图所示。

7、最后按f12预览就可以看到视频播放器了。

Q2: css样式怎么写

css样式是HTML的一个补充，简单的css使用样式如下:

html

body

div id=div/div

/body

style type="text/css"

width:300px;//设置div的宽度300像素

height:500px;//设置div高度500像素

background-color:red;//设置div的背景颜色为红色

/style

/html

css代码位于style之间，详细的css代码解释见代码注释。