2023.10.24每日总结

 

<!-- <!DOCTYPE html>声明是html文件 -->
<!DOCTYPE html>
<html lang="en">
<head>
    <!-- 有些只有单标签比如meta -->
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <!-- 改变标签页 -->
    <title>超级暴龙王</title>
    <link rel="stylesheet" href="../style.css">
    <style type="text/css">

        #btn{ width:100px;height:40px; font-size:20px;border-radius:10px;}
        
        #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>
         <style type="text/css">

            #btn,#btn2{ width:100px;height:40px; font-size:20px;border-radius:10px;           
              background:#44dc81;}
            
            #main{ width:800px;height:600px; background:#fcfcfc; margin: 60px 250px;
            
            text-align:center; position:relative;}
            
            /* #vido{ width:602px; height:402px; border:1px dotted #00ff66; 
            
            margin:0 auto; position:absolute; top:100px; left:400px;} */
             </style>
</head>
<body>
    <div id="main">
    <table width="1000px" height="500px" border="1px" cellspacing="0">
        <tr>
            <th>视频资源名称</th>
            <th>查看</th>
            <th>视频内容</th>
        </tr>
        <tr>
            <td>摸摸看</td>
            <td><input type="button" id="btn" onclick="open_video()" value="播放视频">
                <input type="button" id="btn2" onclick="close1()" value="关闭视频">
            </td>
            <td align="center">
                <video  id="1" width="600" height="400" controls>
                    <source src="./video/lulukan.mp4" type="video/mp4">   
               </video> 
            </td>
        </tr>
        <tr>
            <td>亲亲看</td>
            <td><input type="button" id="btn" onclick="open_video2()" value="播放视频">
                <input type="button" id="btn2" onclick="close2()" value="关闭视频">
            </td>
            <td align="center"><video id="2" width="600" height="400" controls>
                <source src="./video/lulukan.mp4" type="video/mp4">   
           </video> 
            </td>
        </tr>
        <tr>
            <td>抱抱看</td>
            <td><input type="button" id="btn" onclick="open_video3()" value="播放视频">
                <input type="button" id="btn2" onclick="close3()" value="关闭视频">
            </td>
            <td align="center">
                <video id="3" width="600" height="400" controls>
                    <source src="./video/lulukan.mp4" type="video/mp4">   
               </video>
            </td>
        </tr>
    </table>
</div>
    <script>

        window.onload=function non(){
        
        document.getElementById("1").style.cssText = "display:block;";
        document.getElementById("2").style.cssText = "display:none;";
        document.getElementById("3").style.cssText = "display:none;";
        
        }
        function close1() {
            window.location.reload();
        }
        function open_video(){
document.getElementById("1").style.cssText = "display:block;";
}
function close2() {
    window.location.reload();
        }
        function open_video2(){
document.getElementById("2").style.cssText = "display:block;";
document.getElementById("3").style.cssText = "display:none;";
document.getElementById("1").style.cssText = "display:none;";
}
function close3() {
            // document.getElementById("3").style.cssText = "display:none;"           
window.location.reload();
        }
        function open_video3(){
document.getElementById("3").style.cssText = "display:block;";
document.getElementById("2").style.cssText = "display:none;";
document.getElementById("1").style.cssText = "display:none;";
}
</script>
</body>
</html>

 

 

 

posted @ 2023-10-24 21:58  超爱彬宝同学  阅读(26)  评论(0)    收藏  举报