HTML怎么点击按钮弹出视频

1、第一步：首先我们打开网页制作软件，进行编写简单的网页布局。先编写一个播放视频的按钮。<div id="main" class=""> <input type="button" id="btn" onclick="open_video()" value="播放视频"></div>

3、第三步：给编写的div标签进行样式编写，以便在浏览中呈现出较好的预览效果。<style type="text/css"> #btn{ width:100px;height:40px; font-size:20px;border-radius:10px; background:#ff0066;margin-top:550px; } #main{ width:800px;height:600px; background:#cc00cc; margin:0 auto;text-align:center;} #vido{ width:602px; height:402px; border:1px dotted #00ff66; margin:0 auto;}</style>

5、第五步：在浏览器中进行浏览，看看布局是否合理。

7、第七步：继续编写js，实现点击按钮弹出视频。自定义一个函数open_video().function open_video(){ document.getElementById("vido").style.cssText = "display:block;"; }

9、总结：1、首选打开网页软件进行简单的页面布局2、编写相应的样式让视频先隐藏3、编写js脚本，首先是当打开网页时没有视频display:none4、编写点击按钮后，弹出视频，display:block;