Php 缩放问题_Php_Html_Css_Zooming

Php 缩放问题

php html css

Php 缩放问题,php,html,css,zooming,Php,Html,Css,Zooming,我最近开始学习HTML、CSS和PHP。我正在为学校创建一个网站，但是当我放大google chrome和internet explorer时出现了一些问题，我还没有测试过其他浏览器。当我放大时，我的联系人表单会飞起来这是我的标题： <?php session_start(); ?> <!DOCTYPE html> <html> <head> <meta charset="UTF-8"> <title>Mijn web

我最近开始学习HTML、CSS和PHP。我正在为学校创建一个网站，但是当我放大google chrome和internet explorer时出现了一些问题，我还没有测试过其他浏览器。当我放大时，我的联系人表单会飞起来

这是我的标题：

<?php
session_start();
?>

<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<title>Mijn website</title>
<link rel="stylesheet" type="text/css" href="opmaak.css">
</head>
<body>
<img src="images/header.jpg" style="width: 100%; height: 125px; margin: 0px;                     
 padding: 0px; border: 0px; outline: 0px; font-size: 0px;" />
<!-- Comment !-->
<header>
<nav>
    <ul>
        <li><a href="index.php">Home</a></li>
        <li><a href="contact.php">Contact</a></li>
        <?php
        if (isset($_SESSION['id'])) {
        echo "<form action='includes/logout.inc.php'>
        <button> Log out </button>
        </form>";
        } else {
        echo "<form action='includes/login.inc.php' method='POST'>
        <input type='text' name='uid' placeholder='Username'> 
        <input type='password' name='pwd' placeholder='Password'> 
        <button type='submit'>Login</button>
        </form>";
        }

        ?>
        <li><a href="signup.php">Signup</a></li>
    </ul>
</nav>
</header>

正常视图：

问题：

您并不是真的想要查看放大的网站。如果您仍然想这样做，那么我建议您创建一个响应css以获得所需的效果。在w3schools上阅读更多关于它的信息。是的，只要它能适应你想要的屏幕大小，你就可以go@tei，你能嵌入你的图片而不是使用外部链接吗？@Chic没有1个声誉，他们不能。我只是为他们做的。考虑链接一个标准化。CSS/RESET.CSS文件，而不是使用*{}来“重置”元素样式在浏览器上。Normalize将使元素样式在浏览器中更加一致，reset将使每个元素都具有最小的样式。您还可以编辑这两个文件以满足您的需要。

    <?php
include 'header.php';
?>

<?php
if (empty($_POST) === false) {
$errors = array();

$name = $_POST['name'];
$email = $_POST['email'];
$message = $_POST['message'];

if (empty($name) === true || empty($email) === true || empty($message) ===             
 true) {
    $errors[] = 'Name, email and message are required!';
}
else {
    if (filter_var($email, FILTER_VALIDATE_EMAIL) === false) {
        $errors[] = 'That\'s not a valid email address';
    }
}

if (empty($errors) === true) {
    echo "<h1>Thanks for contacting us $name</h1>";
    echo "<br />";
    echo "We will send a reply to $email soon!";
    echo "<br />";
    echo "Your message: $message";
};

}
?>

<?php
if (empty($errors) === false) {
    echo '<ul>';
    foreach($errors as $error) {
            echo '<li>', $error, '</li>';
    }
    echo '</ul>';
    echo '<br />';

}
if (isset($_SESSION['id'])) {
    echo    "<form action='' method='POST' style='height: 200px; width:     
 400px; position: fixed; top: 50%; left: 50%; margin-top: -5%; margin-left:     
 -15% ;'>
            <p>
                <label for='name'> Name: </label><br />
                <input type='text' name='name' id='name' style='width: 100%;     
 padding: 15px; background:#f8f8f8; border:1px solid rgba(0, 0, 0, 0.075); 
 margin-bottom:25px; color:#727272 !important; font-size:13px; -webkit-
 transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s;'>
            </p>
            <p>
                <label for='email'>Email:</label><br />
                <input type='text' name='email' id='email' style='width: 
 100%; padding: 15px; background:#f8f8f8; border:1px solid rgba(0, 0, 0, 
 0.075); margin-bottom:25px; color:#727272 !important; font-size:13px; -
 webkit-transition: all 0.4s; -moz-transition: all 0.4s; transition: all 
 0.4s;'>
            </p>
            <p>
                <label for='message'>Message:</label><br />
                <textarea name='message' id='message' style='width: 100%; 
 padding: 15px; background:#f8f8f8; border:1px solid rgba(0, 0, 0, 0.075); 
 margin-bottom:25px; color:#727272 !important; font-size:13px; -webkit-
 transition: all 0.4s; -moz-transition: all 0.4s; transition: all 0.4s;'>
 </textarea>
            </p>
            <p>
            <input type='submit' value='Submit' style='padding:8px 12px; 
 color: #fff; background:#000; display: block; width:120px; margin:10px 0 
 0px 0; border-radius:3px; -webkit-transition: all 0.3s; -moz-transition: 
 all 0.3s; transition: all 0.3s; text-align:center; font-size:0.8em; box-
 shadow: 0px 1px 4px rgba(0,0,0, 0.10); -moz-box-shadow: 0px 1px 4px 
 rgba(0,0,0, 0.10); -webkit-box-shadow: 0px 1px 4px rgba(0,0,0, 0.10);'>
            </p>
            </form>  ";
} else {
    echo "You do not have permission to view this page, please log in.";
}

?>
</div>
</body>
</html>

    * {
margin: 0px;
padding: 0px;
text-decoration: none;
}

header {
width: 100%;
height: 60px;
background-color: #222;
}

nav ul {
float: right;
margin-top: 20px;
margin-right: 60px;
}

nav ul li {
list-style: none;
float: left;
margin-right: 20px;
}

nav ul li a {
color: #fff;
font-family: Arial;
font-size: 16px;
}

nav ul form {
float: left;
}

nav ul form input {
float: left;
border: none;
margin-right: 10px;
}

nav ul form button {
float: left;
border: none;
margin-right: 6px;
background-color: #fff;
color: #000;
font-size: 16px;
cursor: pointer;
border-radius: 5px;
}

#registreren {
    width: 300px;
    margin: 0 auto;
}