Question

如果我的网站以纵向方式加载到移动设备上，则在旋转到横向时，这些段落太大了。如果以横向方向加载，则段落的大小与CSS中指定的大小相同。

可能导致此问题的原因是什么？

HTML

<body>
<div id="container">
    <div id="body">
        <?php include ("mainMenu.php");?>
        <div style="text-align: center">
            <form id="uDF" method="post" onsubmit="submitValidation(event)">
            <p1 style="visibility: hidden" id="para">Message has been sent</p1>
            <p1 style="visibility: visible" id="emailUs">Email Us</p1>
            <input type="submit" name="uDFButton" value="Submit" class="btnSubmit" id="btSub"/>
            </form>
        </div>
   </div><br><br>
   <?php include ("footer.php")?>
</div>
</body>

CSS

@media screen and (orientation: landscape){
 p1{
    color: #B3B3B3;
    font-size: 20px;
    text-align: center;
    font-family: "Lucida Sans Typewriter", "Lucida Console", monaco, "Bitstream Vera Sans Mono", monospace;
 }
}
@media screen and (orientation: portrait){
p1{
    font-size: 40px;
    color: #B3B3B3;
    text-align: center;
    font-family: "Lucida Sans Typewriter", "Lucida Console", monaco, "Bitstream Vera Sans Mono", monospace;
}

}

在移动设备上更改方向时，段落大小不正确

0 个答案: