laolu 发表于 2022-12-5 12:47

自己写的垃圾HTML网页.....

非常难看,并且插入了一大堆没有用的代码,有用的就几行。谁愿意看看,哈哈
<!DOCTYPE html>
<html lang="en">
    <head>
      <meta charset="utf-8">
      <title>服务器倒计时</title>
          <script type="text/javascript">
get=function (id){return document.getElementById(id)}
if(document.all){
      window.XMLHttpRequest=function(){
          var get=['Microsoft.XMLHTTP','Msxml2.XMLHTTP'];
      for(var i=0;i<get.length;i++){try{return new ActiveXObject(get)}catch(e){}};
      };
}
webDate=function(fn){
    var Htime=new XMLHttpRequest();
    Htime.onreadystatechange=function(){Htime.readyState==4&&(fn(new Date(Htime.getResponseHeader('Date'))))};
    Htime.open('HEAD', '/?_='+(-new Date));
    Htime.send(null);
}
window.time=new Date();
targetTime=new Date();
time2String=function (t){
      with(t)return [getFullYear(),'年'
      ,('0'+(getMonth()+1)).slice(-2),'月'
      ,('0'+getDate()).slice(-2),'日 '
      ,('0'+getHours()).slice(-2),': '
      ,('0'+getMinutes()).slice(-2),': '
      ,('0'+getSeconds()).slice(-2)].join('')
}
int2time=function (m){
    m-=(D=parseInt(m/86400000))*86400000;
    m-=(H=parseInt(m/3600000))*3600000;
    S=parseInt((m-=(M=parseInt(m/60000))*60000)/1000);
    return D+'天'+H+'小时'+M+'分'+S+'秒'
}
setInterval(function (){
    webDate(function (webTime){
      get('web').innerHTML=time2String(time=webTime);
    })
    get('locale').innerHTML=time2String(new Date);
    get('time').innerHTML=int2time(targetTime-time);
    if ((targetTime-time)<0) {
      get('time').innerHTML = 'Game Over';
    }
},1000)
</script>
    </head>
    <body>
      <!DOCTYPE html>
<html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
<style>
body {
        background-color:#d0e4fe;
}
h1 {
        color:orange;
        text-align:center;
}
p {
        font-family:"Times New Roman";
        font-size:20px;
}
</style>
</head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
<style>
body
{
        background-image:url('https://ts1.cn.mm.bing.net/th/id/R-C.171e8fe1aa1544a1868ab710eed82d82?rik=FLPxvVVL9C9bnQ&riu=http%3a%2f%2fwww.pp3.cn%2fuploads%2fallimg%2f200710%2f14-200G00Z321.jpg&ehk=Lb0IHCCZIdqYQOi28m%2borU8c1ARGbTEC%2f8WYzfwRuHo%3d&risl=&pid=ImgRaw&r=0');
        background-color:#12da44;
}
</style>
</head>
<body>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
<style>
div {
    background-color: lightgrey;
    width: 300px;
    border: 25px solid green;
    padding: 25px;
    margin: 25px;
}
</style>
</head>
<body>

<h2>中考倒计时</h2>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
<style>
p.one
{
        border-style:solid;
        border-color:red;
}
p.two
{
        border-style:solid;
        border-color:#98bf21;
}
</style>
</head>

<body>
<h1 class="one"> 2022年中考时间:2022年6月21日0时0分0秒<br></h1>
<h1 class="two"> 服务器时间:<span id='web'>loading...</span><br></h1>
<h1> 本地时间:<span id="locale">loading...</span><br></h1>
<h1>   倒计时时间:<span id="time">loading...</span></h1>
      <script type="text/javascript" charset="utf-8">
          targetTime=new Date(2022,6,21,00,00,00);
      </script>
      <atitle="鹿幽凌">鹿幽凌</a>
      <meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>

<p style="background-color:#00ff6a">
鹿幽凌提供技术支持和服务器支持
</p>

<p style="background-color:rgb(0, 255, 149)">
2022年河北省衡水市中考倒计时(为至臻学子制作)
</p>

<p style="background-color:rgb(17, 0, 255)">
欣赏诗句,努力奋斗,学习深刻毛泽东思想
</p>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
</head>
<body>
    <span id="jinrishici-sentence">正在加载今日诗词....</span>
    <script src="https://sdk.jinrishici.com/v2/browser/jinrishici.js" charset="utf-8"></script>

<h2>Norwegian Mountain Trip</h2>
<img border="0" src="/images/pulpit.jpg/e9ace7f722e63b86e7243fd9d0e692d.jpg" alt="Pulpit rock" width="304" height="228">

<body background="C:\Users\luyouling\Desktop"

style=" background-repeat:no-repeat ;

background-size:100% 100%;

background-attachment:fixed;" >
    </body>
    <html>
<head>
<meta charset="utf-8">
<title>菜鸟教程(runoob.com)</title>
<style>
.button {
    background-color: #4CAF50; /* Green */
    border: none;
    color: white;
    padding: 16px 32px;
    text-align: center;
    text-decoration: none;
    display: inline-block;
    font-size: 16px;
    margin: 4px 2px;
    -webkit-transition-duration: 0.4s; /* Safari */
    transition-duration: 0.4s;
    cursor: pointer;
}

.button1 {
    background-color: white;
    color: black;
    border: 2px solid #4CAF50;
}

.button1:hover {
    background-color: #4CAF50;
    color: white;
}

.button2 {
    background-color: white;
    color: black;
    border: 2px solid #008CBA;
}

.button2:hover {
    background-color: #008CBA;
    color: white;
}

.button3 {
    background-color: white;
    color: black;
    border: 2px solid #f44336;
}

.button3:hover {
    background-color: #f44336;
    color: white;
}

.button4 {
    background-color: white;
    color: black;
    border: 2px solid #e7e7e7;
}

.button4:hover {background-color: #e7e7e7;}

.button5 {
    background-color: white;
    color: black;
    border: 2px solid #555555;
}

.button5:hover {
    background-color: #555555;
    color: white;
}
</style>
</head>
<body>


<button class="button button1"><a >鹿幽凌的小站</a></button>
<button class="button button2">摆设</button>
<button class="button button3">摆设</button>
<button class="button button4">摆设</button>
<button class="button button5">摆设</button>

</body>
</html>
</html>

自己改时间和题目吧,本人一般不写HTML,喜欢写JAVA,但是昨天心血来潮做了一个,找了找资料

hjxhjxjx 发表于 2022-12-5 13:25

laolu 发表于 2022-12-5 13:17
你有自己的网站吗?发来瞅瞅

bci9.cn
目前都没怎么用了,算是摆设(炫耀)了

你的代码结构有点乱,“ctrl+c”现象比较明显,帮你稍微优化一下(结构)

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="utf-8">
    <title>服务器倒计时</title>
    <script src="https://sdk.jinrishici.com/v2/browser/jinrishici.js" charset="utf-8"></script>
<style>
body {
    background-color:#d0e4fe;
}
h1 {
    color:orange;
    text-align:center;
}
p {
    font-family:"Times New Roman";
    font-size:20px;
}
body
{
    background-image:url('https://ts1.cn.mm.bing.net/th/id/R-C.171e8fe1aa1544a1868ab710eed82d82?rik=FLPxvVVL9C9bnQ&riu=http%3a%2f%2fwww.pp3.cn%2fuploads%2fallimg%2f200710%2f14-200G00Z321.jpg&ehk=Lb0IHCCZIdqYQOi28m%2borU8c1ARGbTEC%2f8WYzfwRuHo%3d&risl=&pid=ImgRaw&r=0');
    background-color:#12da44;
}
div {
    background-color: lightgrey;
    width: 300px;
    border: 25px solid green;
    padding: 25px;
    margin: 25px;
}
p.one
{
    border-style:solid;
    border-color:red;
}
p.two
{
    border-style:solid;
    border-color:#98bf21;
}
</style>
</head>
<body>
<h2>中考倒计时</h2>
<h1 class="one"> 2022年中考时间:2022年6月21日0时0分0秒<br></h1>
<h1 class="two"> 服务器时间:<span id='web'>loading...</span><br></h1>
<h1> 本地时间:<span id="locale">loading...</span><br></h1>
<h1>   倒计时时间:<span id="time">loading...</span></h1>

<atitle="鹿幽凌">鹿幽凌</a>
<p style="background-color:#00ff6a">鹿幽凌提供技术支持和服务器支持</p>
<p style="background-color:rgb(0, 255, 149)">2022年河北省衡水市中考倒计时(为至臻学子制作)</p>
<p style="background-color:rgb(17, 0, 255)">欣赏诗句,努力奋斗,学习深刻毛泽东思想</p>
<span id="jinrishici-sentence">正在加载今日诗词....</span>

<h2>Norwegian Mountain Trip</h2>
<img border="0" src="/images/pulpit.jpg/e9ace7f722e63b86e7243fd9d0e692d.jpg" alt="Pulpit rock" width="304" height="228">

<button class="button button1"><a >鹿幽凌的小站</a></button>
<button class="button button2">摆设</button>
<button class="button button3">摆设</button>
<button class="button button4">摆设</button>
<button class="button button5">摆设</button>

</body>
</html>
<script type="text/javascript">
targetTime=new Date(2022,6,21,08,00,00);

get=function (id){return document.getElementById(id)}
if(document.all){
    window.XMLHttpRequest=function(){
      var get=['Microsoft.XMLHTTP','Msxml2.XMLHTTP'];
    for(var i=0;i<get.length;i++){try{return new ActiveXObject(get)}catch(e){}};
    };
}
webDate=function(fn){
var Htime=new XMLHttpRequest();
Htime.onreadystatechange=function(){Htime.readyState==4&&(fn(new Date(Htime.getResponseHeader('Date'))))};
Htime.open('HEAD', '/?_='+(-new Date));
Htime.send(null);
}
window.time=new Date();
targetTime=new Date();
time2String=function (t){
    with(t)return [getFullYear(),'年',
      ('0'+(getMonth()+1)).slice(-2),'月',
      ('0'+getDate()).slice(-2),'日 ',
      ('0'+getHours()).slice(-2),': ',
      ('0'+getMinutes()).slice(-2),': ',
      ('0'+getSeconds()).slice(-2)].join('')
}
int2time=function (m){
m-=(D=parseInt(m/86400000))*86400000;
m-=(H=parseInt(m/3600000))*3600000;
S=parseInt((m-=(M=parseInt(m/60000))*60000)/1000);
return D+'天'+H+'小时'+M+'分'+S+'秒'
}
setInterval(function (){
webDate(function (webTime){
    get('web').innerHTML=time2String(time=webTime);
})
get('locale').innerHTML=time2String(new Date);
get('time').innerHTML=int2time(targetTime-time);
if ((targetTime-time)<0) {
    get('time').innerHTML = 'Game Over';
}
},1000)
</script>

hjxhjxjx 发表于 2022-12-5 12:59

至少……中考是早上八点整开始的
这是我中考前写的倒计时
<html>
<head>
    <title>中考倒计时</title>
</head>
<body>
<center>
<br><br><br>
<h1 id="bt">中考倒计时</h1>
<div id="time" style="font-size:36px;">中考倒计时</div>
<br><br><br><br>
<p id="text" style="font-size:20px;">加油!</p>
</center>
</body>
</html>
<script>
index();
function index(){
    if(new Date().getTime()/1000<1656117000){
      a=window.document.getElementById("bt");
      a.innerHTML="距离中考仅剩";
      c(1);
      setInterval("c(1);",1000);
    }
    else if(new Date().getTime()/1000>1656117000&&new Date().getTime()/1000<1656300600){
      a=window.document.getElementById("bt");
      a.innerHTML="距离结束中考还有";
      a=window.document.getElementById("text");
      a.innerText="坚持!";
      c(2);
      setInterval("c(2);",1000);
    }
    else{
      a=window.document.getElementById("bt");
      a.innerHTML="中考已结束";
      a=window.document.getElementById("text");
      a.innerHTML="解放!";
      a=window.document.getElementById("time");
      a.innerHTML="归零";
    }
}

function c(n){
    if(n==1){
      a=window.document.getElementById("time");
      i=(1656117000-new Date().getTime()/1000);
      k=parseInt(i/3600)+"小时"+parseInt((i%3600)/60)+"分"+parseInt((i%60))+"秒"
      a.innerHTML=k;
      if(new Date().getTime()/1000>1656117000&&new Date().getTime()/1000<1656302100){
            clearInterval();
            index();
      }
    }
    else if(n==2){
      a=window.document.getElementById("time");
      i=(1656302100-new Date().getTime()/1000);
      k=parseInt(i/3600)+"小时"+parseInt((i%3600)/60)+"分"+parseInt((i%60))+"秒"
      a.innerHTML=k;
      if(new Date().getTime()/1000>1656302100){
            clearInterval();
            index();
      }
    }
}
</script>

laolu 发表于 2022-12-5 13:00

hjxhjxjx 发表于 2022-12-5 12:59
至少……中考是早上八点整开始的
这是我中考前写的倒计时



或许吧,我今年初三,不清楚,就设置的0点

laolu 发表于 2022-12-5 13:02

hjxhjxjx 发表于 2022-12-5 12:59
至少……中考是早上八点整开始的
这是我中考前写的倒计时



但是似乎你写的太简陋了,我打算后期再加点UI元素,折腾永无止境,hh

hjxhjxjx 发表于 2022-12-5 13:05

laolu 发表于 2022-12-5 13:02
但是似乎你写的太简陋了,我打算后期再加点UI元素,折腾永无止境,hh

确实,主要是当时时间太赶了

laolu 发表于 2022-12-5 13:17

hjxhjxjx 发表于 2022-12-5 13:05
确实,主要是当时时间太赶了

你有自己的网站吗?发来瞅瞅{:301_978:}

a38758720 发表于 2022-12-5 13:26

中考倒计时-.- 楼主多大年纪了

laolu 发表于 2022-12-5 13:26

hjxhjxjx 发表于 2022-12-5 13:25
bci9.cn
目前都没怎么用了,算是摆设(炫耀)了



看看我的luyouling.cn
非常好看

hjxhjxjx 发表于 2022-12-5 13:28

laolu 发表于 2022-12-5 13:26
看看我的luyouling.cn
非常好看

{:1_921:}{:1_921:}{:1_921:}
是套模板吗
页: [1] 2 3 4 5
查看完整版本: 自己写的垃圾HTML网页.....