找到
13
篇与
HTML
相关的结果
-
「 【WEB】给你的网站增加运行时间代码 」 AI摘要:本文介绍了如何为网站添加显示运行时间的代码,包括显示当前日期和自建站以来运行的天数、小时、分钟和秒。演示 000061图片 代码如下 代码一 - <center> 今天是:<span><script language=Javascript type=text/Javascript> var day=""; var month=""; var ampm=""; var ampmhour=""; var myweekday=""; var year=""; mydate=new Date(); myweekday=mydate.getDay(); mymonth=mydate.getMonth()+1; myday= mydate.getDate(); myyear= mydate.getYear(); year=(myyear > 200) ? myyear : 1900 + myyear; if(myweekday == 0) weekday=" 星期日 "; else if(myweekday == 1) weekday=" 星期一 "; else if(myweekday == 2) weekday=" 星期二 "; else if(myweekday == 3) weekday=" 星期三 "; else if(myweekday == 4) weekday=" 星期四 "; else if(myweekday == 5) weekday=" 星期五 "; else if(myweekday == 6) weekday=" 星期六 "; document.write(year+"年"+mymonth+"月"+myday+"日 "+weekday); </script> </div> <center><b><FONT COLOR="#008B00">【本站已经可爱滴运行】</FONT></b> <span id="span_dt_dt"></span> <SCRIPT language=javascript> <!-- //document.write(""); function show_date_time(){ window.setTimeout("show_date_time()", 1000); BirthDay=new Date("3-9-2020 08:00:00");//建站日期 today=new Date(); timeold=(today.getTime()-BirthDay.getTime()); sectimeold=timeold/1000 secondsold=Math.floor(sectimeold); msPerDay=24*60*60*1000 e_daysold=timeold/msPerDay daysold=Math.floor(e_daysold); e_hrsold=(daysold-e_daysold)*-24; hrsold=Math.floor(e_hrsold); e_minsold=(hrsold-e_hrsold)*-60; minsold=Math.floor((hrsold-e_hrsold)*-60); seconds=Math.floor((minsold-e_minsold)*-60); span_dt_dt.innerHTML=daysold+"天"+hrsold+"小时"+minsold+"分"+seconds+"秒" ; } show_date_time(); //--> </SCRIPT> </center> </span> 代码二 - <span id="website_runtime"></span> <script type="text/javascript"> function show_runtime(){ // 定时器 window.setTimeout("show_runtime()", 1000); // 开始时间 let start = new Date("2019/02/08 00:00:00"); // 当前时间 let now = new Date(); // 经过时长 let duration = now.getTime() - start.getTime(); // 一天的毫秒数 let msPerDay = 24 * 60 * 60 * 1000; // 天 let _day = duration / msPerDay; let day = Math.floor(_day); // 小时 let _hour = (_day - day) * 24; let hour = Math.floor(_hour); // 分钟 let _minute = (_hour - hour) * 60; let minute = Math.floor(_minute); // 秒 let _second = (_minute - minute) * 60; let second = Math.floor(_second); // 更新span标签内容 website_runtime.innerHTML="本站已运行:" + day + "天" + hour + "小时" + minute + "分" + second + "秒"; } show_runtime(); </script> 代码三 - <span id="website_runtime"></span> <script type="text/javascript"> function show_runtime(){window.setTimeout("show_runtime()",1000);x=new Date("2019/02/08 00:00:00");y=new Date();z=y.getTime()-x.getTime();mspd=24*60*60*1000;_d=z/mspd;d=Math.floor(_d);_h=(_d-d)*24;h=Math.floor(_h);_m=(_h-h)*60;m=Math.floor(_m);_s=(_m-m)*60;s=Math.floor(_s);website_runtime.innerHTML="本站已运行:"+d+"天"+h+"小时"+m+"分"+s+"秒";}show_runtime(); </script> 然后加在你网站的底部代码中,改一下代码中的时间信息即可
-
typecho joe主题美化 手机侧边栏图标颜色修改 AI摘要:美化Typecho Joe主题手机侧边栏图标颜色,通过修改原代码中的字体颜色和图标样式实现,具体步骤包括修改首页、栏目、页面和推荐的代码。效果图 000056图片 修改教程 目录:Joe-master/module/header/slideout.php1.首页 原代码 <span>首页</span>改代码 <span><font color="#ff8900" style="font-weight:600;"> <i class="fa fa-home"></i> 首页</font></span>000050图片 000051图片 2.栏目 原代码 <span>栏目</span>改代码 <span><font color="0909f7b" style="font-weight:600;"> <i class="fa fa-mail-reply-all"></i> 栏目</font></span>000052图片 000053图片 3.页面 原代码 <span>页面</span>改代码 <span><font color="#f709f7b" style="font-weight:600;"> <i class="fa fa-window-restore"></i> 页面</font></span>000054图片 000055图片 4.推荐 原代码 <span>推荐</span>改代码 <span><font color="#66ff00b" style="font-weight:600;"> <i class="fa fa-thumbs-o-up"></i> 推荐</font></span> 很抱歉这个推荐的代码页面没有截屏!
-
js实现页面窗口录制 AI摘要:使用JavaScript实现页面窗口录制,通过在线demo和代码示例展示如何获取屏幕流,使用MediaRecorder录制视频,并在网页中播放和下载录制内容。一,在线demo 1、在线demo地址:http://ys.100000.icu/00007 注:目前测试发现只有在chrome浏览器里可以使用 二、直接上代码 <!DOCTYPE html> <html> <head> <title>Parcel Sandbox</title> <meta charset="UTF-8" /> </head> <body> <video class="video" width="600px" controls></video> <button class="record-btn">录制</button> <script> let btn = document.querySelector(".record-btn") btn.addEventListener("click", async function () { let stream = await navigator.mediaDevices.getDisplayMedia({ video: true }) const mime = MediaRecorder.isTypeSupported("video/webm; codecs=vp9") ? "video/webm; codecs=vp9" : "video/webm" let mediaRecorder = new MediaRecorder(stream, { mimeType: mime }) let chunks = [] mediaRecorder.addEventListener('dataavailable', function (e) { chunks.push(e.data) }) mediaRecorder.addEventListener('stop', function () { let blob = new Blob(chunks, { type: chunks[0].type }) let url = URL.createObjectURL(blob) let video = document.querySelector(".video") video.src = url let a = document.createElement('a') a.href = url a.download = 'video.webm' a.click() }) mediaRecorder.start() }) </script> </body> </html>三,效果 操作步骤: 1、点击录制按钮后,在弹窗窗口中选择需要录制的窗口,并点击分享后开始录制 000057图片 2、录制中时,页面底部会有停止共享的按钮,点击即可结束录制,并下载录制视频到本地,同时可在该页面播放 000058图片
-
社会主义核心价值观-代码 AI摘要:本文介绍了社会主义核心价值观的代码实现,包括HTML代码,展示了国家、社会和个人层面的价值观内容,强调践行这些价值观对国家富强、社会和谐和个人全面发展的意义。效果图 000043图片 演示地址 代码 HTML代码 - <!DOCTYPE html> <html lang="zh-CN"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <title>社会主义核心价值观</title> <link href="http://api.xunjinlu.fun/css/shehuizhuyihexinjiazhiguan.css" rel="stylesheet"> <style> body { font-family: 'Noto Sans SC', Arial, sans-serif; margin: 0; padding: 0; background-color: #ffffff; color: #333; display: flex; justify-content: center; align-items: center; min-height: 100vh; flex-direction: column; } .container { max-width: 800px; padding: 20px; background-color: #ffffff; box-shadow: 0 2px 10px rgba(0, 0, 0, 0.1); border: 3px solid #d32f2f; border-radius: 10px; } h1 { color: #d32f2f; text-align: center; margin-bottom: 20px; font-size: 2.5em; } h2 { color: #b71c1c; margin-top: 20px; margin-bottom: 10px; border-bottom: 2px solid #b71c1c; padding-bottom: 5px; font-size: 1.8em; } p { line-height: 1.8; margin-bottom: 15px; font-size: 1.2em; } .values { display: flex; justify-content: space-around; margin-top: 20px; margin-bottom: 20px; flex-wrap: wrap; /* 允许内容换行 */ } .values div { text-align: center; width: 30%; background-color: #fbe9e7; border: 2px solid #b71c1c; border-radius: 10px; padding: 10px; box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1); margin-bottom: 20px; /* 增加块之间的间距 */ transition: transform 0.3s; } @media (max-width: 768px) { .values div { width: 100%; /* 在手机界面上每个块占据整个行 */ } } .footer { text-align: center; padding: 15px; margin-top: 20px; color: #fff; background-color: #d32f2f; border-top: 3px solid #b71c1c; border-radius: 0 0 10px 10px; font-size: 1.2em; } .footer p { margin: 5px 0; } .footer small { display: block; margin-top: 10px; font-size: 0.9em; color: #f0f0f0; } </style> </head> <body> <div class="container"> <h1>社会主义核心价值观</h1> <p>社会主义核心价值观是中国共产党在新时期提出的重要指导思想,是社会主义现代化建设的重要精神<a href="/"target="_blank" style="color:#17202a;text-decoration: none;">支</a>柱。每个公民应当积极践行社会主义核心价值观,共建美好社会。</p> <h2>核心价值观内容</h2> <div class="values"> <div> <h3><a href="/" target="_blank" style="color: #d32f2f;text-decoration: none;">国家层面</a></h3> <p>富强、民主、文明、和谐</p> </div> <div> <h3><a href="/" target="_blank" style="color: #d32f2f;text-decoration: none;">社会层面</a></h3> <p>自由、平等、公正、法治</p> </div> <div> <h3><a href="/" target="_blank" style="color: #d32f2f;text-decoration: none;">个人层面</a></h3> <p>爱国、敬业、诚信、友善</p> </div> </div> <h2>应用和意义</h2> <p>社会主义核心价值观是每个公民应当遵循的道德准则,有助于推动国家富强,社会和谐,个人全面发展。通过践行这些价值观,我们可以共同为实现中华民族伟大复兴的中国梦贡献力量。</p> <div class="footer"> <p>践行社会主义核心价值观,共建美好未来</p> <small>© 2024 尋鯨錄 <br> <a href="https://beian.miit.gov.cn/" target="_blank" style="color: #f0f0f0;text-decoration: none;">滇ICP备2023007716号-1</a> <br> <a href="https://beian.mps.gov.cn/#/query/webSearch" target="_blank" style="color: white; text-decoration: none;"> <img src="https://beian.mps.gov.cn/img/logo01.dd7ff50e.png" alt="公安备案图标" style="vertical-align: middle; height: 15px; width: auto; margin-right: 5px;">公安备案号:滇公网安备53032202530370号</a> </small> </div> </div> </body> </html> 演示地址