Próbowałem stylizować przycisk przesyłania formularza, ale nie odpowiada on na żadne style CSS. Próbowałem użyć jego class indywidualnie i również id indywidualnie, a nawet obie class i id razem, ale nic nie działa. Załączam kod:
HTML / PHP
if ($_POST["submit"]) {
$member_username = "username";
$member_password = "pass****";
$username = $_POST["username"];
$password = $_POST["password"];
if ($username == $member_username && $password == $member_password) {
$_SESSION["username"] = $username;
header("Location: secret.php");
} else {
echo "Incorrect username or password";
}
}
?>
<!DOCTYPE html>
<html>
<head>
<link href="style.css" rel=stylesheet />
<link href="http://fonts.googleapis.com/css?family=Oswald:400,700" rel="stylesheet" type="text/css">
<title>Topaz</title>
</head>
<body>
<div class="index">
<div class="indexcontainer">
<h1>Topaz</h1>
<div class="indexform">
<form action="index.php" method="POST">
<input class="textbox" type="text" name="username" placeholder="Username" /><br /><br /><br />
<input class="textbox" type="password" name="password" placeholder="Password" /><br /><br /><br />
<input class="submit" id="submit" type="submit" name="submit" value="Login" />
</form>
</div>
</div>
</div>
</body>
</html>
CSS
.submit {
width: 200px;
}
#submit {
width: 200px;
}
Odpowiedzi:
2 dla odpowiedzi № 1Prawdopodobnie jest to po prostu względne poklepywanie styluarkusz, wciśnij F12 (dla chromu może być konieczne włączenie konsoli dev, google w razie potrzeby) i sprawdź, czy panel sieci lub panel konsoli pokazuje błąd 404 dla jednego lub więcej plików.
Rzeczywisty css ma zastosowanie
<!DOCTYPE html>
<html>
<head>
<!--
<link href="style.css" rel="stylesheet" />
-->
<style>
.submit{width:200px; color:red;}
</style>
<link href="http://fonts.googleapis.com/css?family=Oswald:400,700" rel="stylesheet" type="text/css">
<title>Topaz</title>
</head>
<body>
<div class="index">
<div class="indexcontainer">
<h1>Topaz</h1>
<div class="indexform">
<form action="index.php" method="POST">
<input class="textbox" type="text" name="username" placeholder="Username" />
<br />
<br />
<br />
<input class="textbox" type="password" name="password" placeholder="Password" />
<br />
<br />
<br />
<input class="submit" id="submit" type="submit" name="submit" value="Login" />
</form>
</div>
</div>
</div>
</body>
</html>Upewnij się, że „style.css” jest na tym samym poziomie, co plik php lub html, który jest aktualnie trafiany, lub użyj względnego pathing.
Również jego dobra forma do sprawdzania poprawności html i css, ponieważ niepowiązane błędy składniowe mogą przerwać stylizację.
Dla html: https://validator.w3.org/
Dla css: https://jigsaw.w3.org/css-validator/
Ale te prawdopodobnie nie będą w stanie wychwycić problemów związanych z krosowaniem, po prostu składnią, więc upewnij się, że używasz konsoli programisty dla jakiejkolwiek przeglądarki, której używasz.
0 dla odpowiedzi nr 2
Możesz spróbować dodać styl wewnętrzny, który będzie miał pierwszeństwo przed zewnętrznym arkuszem stylów. Wystarczy użyć tagu, a następnie umieścić w obszarze tagu głowy.
<style>
.submit {
width: 200px;
}
#submit {
width: 200px;
}
</style>