欢迎词页面的欢迎词水平垂直居中，全靠chatGPT-526互联

1. 问题描述

前台欢迎词要求支持竖屏。

2. 问题解决

问chatGPT

3. 源代码

<!--#include file="conn.asp"-->
<!--#include file="adovbs.inc"-->

<HTML>
<HEAD>

<style type="text/css"> 
body{ 
/*适应安卓程序*/
background: rgb(246,248,249);
            background: url('images/welcome.png') no-repeat center fixed;
            background-attachment: fixed;
            background-size: 100% 100%;

/*适应IE*/         
filter:progid:DXImageTransform.Microsoft.AlphaImageLoader(src='images/welcome.png',sizingMethod='scale'); 
background-repeat: no-repeat; 
background-positon: 100%, 100%; 

} 
</style>

<TITLE></TITLE>

</HEAD>
<!--#include file="gs.asp"-->
<body  style="height: 100vh;margin: 0;">


 
 	<div style="display: flex;justify-content: center;height: 100%;width: 100%;align-items: center;">
   
   <div style="margin: auto;">
   <div style="position:static;top: 50%;">           

   <textarea  id="txt" cols=110 rows=20 style="color:white;resize:none;overflow:auto;background:transparent;border-style:none;overflow-y:hidden;overflow-x:hidden;
   width:950px; height:400px; max-width:950px; max-height:400px;">
  </textarea>

</div>
</div>
</div>

<%
Dim StrSQL9,rs9,left9,num9
StrSQL9="select * from  welcome" 
Set rs9 = conn.Execute(StrSQL9)
if not rs9.eof Then
left9=rs9("welcometext")
num9=rs9("fontsize")
End If
%>
 <textarea  id="deftxt"  style="display:none ">
  <%=left9%>
  </textarea>
 <input type=text id="deffontsize"  value="<%=num9%>" style="display:none " >
<%
rs9.Close
Set rs9 = Nothing  
%>

<%
Dim StrSQL1,rs1,left1,num1
StrSQL1="select * from  vertical" 
Set rs1 = conn.Execute(StrSQL1)
if not rs1.eof Then
left1=rs1("welcometext")
num1=rs1("fontsize")
End If
%>
 <textarea  id="txt1"  style="display:none ">
  <%=left1%>
  </textarea>
 <input type=text id="fontsize1"  value="<%=num1%>" style="display:none " >
<%
rs1.Close
Set rs1 = Nothing  
%>


<script language="javascript">

var run_index = -1;
var arr = new Array();
var font = new Array();
arr[0] = document.getElementById("txt1").innerText;

font[0] = document.getElementById("fontsize1").value;


if(font[0] == 0)
{
    document.getElementById("txt").innerText=document.getElementById("deftxt").innerText;
	document.getElementById("txt").style.fontSize=document.getElementById("deffontsize").value;
}
else
{
	document.getElementById("txt").innerText= arr[0];
	document.getElementById("txt").style.fontSize=font[0];
}

</script>

</BODY>
</HTML>

4. 效果

横屏&竖屏