HTML 电子屏测试

pojin (ID: 1)

头衔：论坛坛主

等级：究级天王[荣誉]

积分：1301
发帖：99 篇
来自：保密
注册：2022-08-28 23:20:57
造访：2025-03-23 21:18:24

[ 第 1 楼 ]

<!doctype html><html><head>
<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
<title>X X 监控系统</title>
<style type="text/css">
/* 样式规则：横向用 0~100vw，纵向 0~100vh */
body{ margin: 0mm; background: url(http://228mi.com:1180/Upload/JsAspxBBS/2022/04/06/201831.5506.jpg) no-repeat center / 100vw 100vh; height: 100vh; font: 3vw/7vh arial }
h1{ text-align: center; font: bold 3.5vw/7vh arial; margin: 0mm; padding: 1em }
.pos{ position: fixed }
.num1 { left: 10vw; top: 65vh }
.num2{ left: 13vw; top: 72vh }
.num3{ left: 16vw; top: 80vh }
.num4{ right: 10vw; top: 65vh }
.num5{ right: 13vw; top: 72vh }
.num6{ right: 16vw; top: 80vh }
</style></head><body text="white" bgcolor="blue">
<h1>X X 监控系统</h1>
<span class="num1 pos">12</span>
<span class="num2 pos">34</span>
<span class="num3 pos">56</span>
<span class="num4 pos">78</span>
<span class="num5 pos">12</span>
<span class="num6 pos">34</span>

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

[您可以先修改代码再运行]

2022-12-03 22:08:51

IP：已设置保密

pojin (ID: 1)

头衔：论坛坛主

等级：究级天王[荣誉]

积分：1301
发帖：99 篇
来自：保密
注册：2022-08-28 23:20:57
造访：2025-03-23 21:18:24

[ 第 2 楼 ]

样式规则：横向用 0~100vw，纵向 0~100vh。
这样可保证不同分辨率的屏幕都能准确定位。

2022-12-03 22:09:20

IP：已设置保密