javascript - 如何在 CSS 或 Javascript 中的所有页面上添加通知？

Question

我有这个存档的 HTML 页面，虽然不想更改内容，但想添加一条通知:
此内容不再更新。请查看 http://newdomain.com想要查询更多的信息。这是为历史目的而保留的文件 Material 并被卡住。
这是代码:

<TITLE>My Page</TITLE>
<style>
body {
font-family: Verdana, sans-serif;
font-size: 14px;
line-height: 18px;
background: #FFFFFF;
}
a {
text-decoration: none;
color: red;
}
div.sidebar {
background-color: yellow;
padding: 4px solid;
float: left;
height: 600px;
width: 110px;
}
div.content {
width: 430px;
height: 600px;
margin-left: 10px;
margin-right: 10px;
margin-bottom: 10px;
border: 1.5px solid;
}
div.content p {
font-size: 13px;
padding: 20px;
}
div.content img {
margin-left: 20px;
height: 90px;
}
</style>

<div class="sidebar">
<ul>
<li><a href="11.htm">About Us</a></li>
<li><a href="12.htm">Contact Us</a></li>
<li><a href="bestof2008.html">Best of 2008</a></li>
</div>
<div class="content">
<img src="https://upload.wikimedia.org/wikipedia/commons/thumb/2/2b/Derbyshire_flag.svg/1024px-Derbyshire_flag.svg.png">
<h1>Yourlocal.com</h1>
<h2>Welcome to our site</h2>
<h3>See the sidebar for regional content</h3>
<P>This is our website. More content soon, for the East Midlands region of England; we cover Leicestershire, Derbyshire and Nottinghamshire.</p>
</div>

它在纯 HTML 中并在一个单独的目录中；请注意，由于隐私原因，上述内容已更改。
根据网站所有者的意愿，由于历史原因，我无法更改信息(除了通知的样式表，仅此而已)，因此只能使用 HTML 或 Javascript 解决方案；没有 PHP，因为所有文件都以 .htm 或 .html 扩展名(站点的移动主机)存储。
CSS 中有没有办法将该通知放在每个页面上方的黄色背景框中？
一般来说，我如何申请这样的通知？我尝试过 Google-ing，但没有找到不编辑每一页的可行解决方案。

Answer 1

您可能可以利用 ::before CSS 伪元素:
https://developer.mozilla.org/en-US/docs/Web/CSS/::before
这个示例 CSS 将创建一个伪元素，它将成为 body 标签的第一个子元素。

body::before {
  display: block;
  width: 100%;
  background-color: yellow;
  content: "This content is not updated any longer. Please see http://newdomain.com for more information. This is archive material retained for historical purposes and is frozen.";
}