【HTML/CSS3】一个html文件实现真·镜像网站

首先附上成品图和链接:

实例:https://moeblog.top/mirror

2018-09-09 (6).png

  1. <!doctype html>
  2. <html>
  3.         <head>
  4.                 <meta http-equiv="Content-Type" content="text/html">
  5.     <link rel="shortcut icon" href="/favicon.ico"/>
  6.     <link rel="bookmark" href="/favicon.ico"/>
  7.                 <title>在这里输入你的网站标题</title>
  8.                 <style type="text/css" media="screen">
  9.             #iframe {
  10.         transform: matrix(-1, 0, 0, 1, 0, 0);
  11.         position: absolute;
  12.         width: 100%;
  13.         height: 100%;
  14.         top: 0px;
  15.         left: 0;
  16.         border: none;
  17.             }
  18.                 </style>
  19.         </head>
  20.         <body>
  21.                 <iframe id="iframe" src="https://moeblog.top/Blog" name="navigationFrame" target="_self"></iframe>
  22.         </body>
  23. </html>

这样的话就可以实现和你网站完全相反的效果了,就跟原先的bilibili镜子站一样。

点赞

发表评论

电子邮件地址不会被公开。必填项已用 * 标注