noscript 样式无效
noscript style no working
嘿,我正在制作一个 html 文档,我想拥有它,以便当有人访问该页面并启用 noscript 时,它会使整个页面变黑并显示白色文本 "enable JavaScript"
这是我的代码:
<noscript>
<style>
.noscript{
width: 4000px;
height: 4000px;
position: fixed;
top: 50%;
left: 60%;
transform: translate(-50%, -50%);
background: black;
}
.noscriptext{
width: 400px;
height: 100px;
position: fixed;
top: 40%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center; font-size: 100%;
color: white;
}
</style>
<div class="noscriptext"><h1>to use this you must enable javascript</h1></div>
</noscript>
<div class="noscript"> </div>
但是它不起作用,请帮忙?
我试过这个:
Body styling for a noscript tag? 但什么也没有。
图片:http://imgur.com/a/KRqXS
您在 . noscriptext
之后有 .noscript
,所以它显示在顶部。在 .noscriptext
之前放置 .noscript
或在 .noscriptext
上使用 z-index
。
但是你可以把它简化很多,我会用它来代替。
<noscript>
<style>
.noscriptext {
position: fixed;
top: 0; left: 0; right: 0; bottom: 0;
background: black;
color: white;
display: flex;
justify-content: center;
align-items: center;
}
</style>
<div class="noscriptext"><h1>to use this you must enable javascript</h1></div>
</noscript>
嘿,我正在制作一个 html 文档,我想拥有它,以便当有人访问该页面并启用 noscript 时,它会使整个页面变黑并显示白色文本 "enable JavaScript" 这是我的代码:
<noscript>
<style>
.noscript{
width: 4000px;
height: 4000px;
position: fixed;
top: 50%;
left: 60%;
transform: translate(-50%, -50%);
background: black;
}
.noscriptext{
width: 400px;
height: 100px;
position: fixed;
top: 40%;
left: 50%;
transform: translate(-50%, -50%);
text-align: center; font-size: 100%;
color: white;
}
</style>
<div class="noscriptext"><h1>to use this you must enable javascript</h1></div>
</noscript>
<div class="noscript"> </div>
但是它不起作用,请帮忙? 我试过这个: Body styling for a noscript tag? 但什么也没有。 图片:http://imgur.com/a/KRqXS
您在 . noscriptext
之后有 .noscript
,所以它显示在顶部。在 .noscriptext
之前放置 .noscript
或在 .noscriptext
上使用 z-index
。
但是你可以把它简化很多,我会用它来代替。
<noscript>
<style>
.noscriptext {
position: fixed;
top: 0; left: 0; right: 0; bottom: 0;
background: black;
color: white;
display: flex;
justify-content: center;
align-items: center;
}
</style>
<div class="noscriptext"><h1>to use this you must enable javascript</h1></div>
</noscript>