Ich style derzeit meine Anmelde- und Registrierungsformulare mit CSS. Ich benutzte ursprünglich ein internes Stylesheet und schrieb alle meine CSS dort (die CSS- und Stil-Tags zwischen den <head> Tags). Jetzt habe ich eine ".css" -Datei erstellt und das gesamte CSS aus dem HTML-Code in das externe Dateiblatt kopiert.CSS-Probleme (Übertragen von Code von der internen in die externe Datei)
Nun, das Problem ist, dass alle CSS-Shows, mit Ausnahme der Hintergrundfarbe des Körpers:
body {
font: 1em/1.62em verdana, sans-serif;
background-color: #249EC7;
}
Aus irgendeinem Grund, wenn dieser Code in einem internen Stylesheet, die Hintergrundfarbe zeigt, aber Wenn ich denselben Code in ein externes Stylesheet übertrage, wird es nicht angezeigt. (Dies ist für das Anmeldeformular)
Das gleiche geschieht mit dem Login-Formular, aber nicht nur, dass der Hintergrundfarbe keine Show, aber die Polsterung nicht zeigen entweder:
<style media='screen'>
body {
font: 1em/1.62em verdana, sans-serif;
background-color: #249EC7;
}
form {
max-width: 58em;
padding: .2em;
margin: auto;
background-color: #648cd1;
color: #31d8eb;
text-align: center;
}
form div {
margin: 0em 1em 1em 1em;
}
form b {
font-size: 1.3em;
}
form b,form input{
display: inline-block;
width: 12em;
}
form input {
padding: 0.25em;
}
h4 a:visited {
color: #F56433;
}
#logindiv {
height: 18.5em;
margin-top: -9.25em;
Ich habe Keine Ahnung, was das Problem verursacht, weil ich im internen und externen Stylesheet buchstäblich dasselbe CSS verwende.
Anmeldeformular HTML:
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='utf-8'>
<meta name='viewport' content='width=device-width,height=device-height,initial-scale=1'>
<link rel='stylesheet' type='text/css' href='/Login & Register System/CSS Files/RegisterFormCSS.css'>
</head>
<body style='background-color: #249EC7;'>
<form action='' method='post'>
<fieldset>
<h1 style='padding-bottom: .2em;'>Register Now!</h1>
<div>
<label for='username'>Username:</label>
<input type='text' id='username' name='username'>
</div>
<div>
<label for='password'>Password:</label>
<input type='password' id='password' name='password'>
</div>
<div>
<label for='passwordconfirm'>Re-enter Password:</label>
<input type='password' id='passwordconfirm' name='passwordconfirm'>
</div>
<div>
<label for='fullname'>First and Last Name:</label>
<input type='text' id='fullname' name='fullname'>
</div>
<div>
<input type='submit' name='register' value='Complete Registration' style='width: 12em; height: 2.5em; cursor: pointer; background-color: #3E1CE8; color: #FAFAFA; font-size: 1.2em;'>
</div>
<div>
<h4 style='color: #F5E749;'>Already own a Connection account? Login <a href='index.php'>Here!</a></h4>
</div>
</fieldset>
</form>
</body>
Login Form HTML:
<!DOCTYPE html>
<html lang='en'>
<head>
<meta charset='UTF-8'>
<meta name='viewport' content='width=device, height=device=height, initial-scale=1'>
</head>
<body style='background-color: #249EC7;'>
<div id='logindiv' style='width: 50%; padding: 10px; border: 5px solid #316ED6; background-color: #648CD1; color: #31D8EB; margin: auto; border-radius: 1.3em; text-align: center;'>
<h1>Login</h1>
<br />
<form action='' method='post'>
<div>
<b>Username:</b>
<input type='text' name='username' style='padding: 4px;'/>
</div>
<div>
<b>Password:</b>
<input type='password' name='password' style='padding: 4px; '/>
</div>
<div>
<input type='submit' value='Login' name='login'/>
</div>
</form>
<div>
<h4>No Account? Register <a href='register.php'>Here!</a></h4>
</div>
</div>
</body>
Oh, ich habe vergessen, das schließende Tag in diesem Beitrag zu kopieren und einzufügen, also tu so, als ob es da wäre. –
Werden Sie auch Ihren HTML-Code einfügen? – Ashwin
Ist der "media = 'screen'" dort absichtlich? Das könnte das Problem sein. – Elvanos