Minha questão:
Endereço do meu fórum:
http://
Olá. Eu estava desenvolvendo uma página em HTML pra um fórum, mas eu estou tendo alguns problemas, obviamente estou aprendendo hehe.
Bom a dúvida é o seguinte. Eu não consigo centralizar bem no meio da página o texto (h1).Código:
<html>
<head>
<meta charset="utf-8">
<meta http-equiv="X-UA-Compatible" content="IE=edge">
<title>Página de teste</title>
<link rel="stylesheet" href="">
</head>
<style type="text/css">
body {
background-image: url(img4.jpg);
-webkit-box-shadow:-15px 0 15px 4px #555;
-moz-box-shadow:-15px 0 15px 4px #555;
-ms-box-shadow:-15px 0 15px 4px #555;
-o-box-shadow:-15px 0 15px 4px #555;
background-repeat: no-repeat;
}
@-webkit-keyframes fadeIn {
0% { opacity: 0; }
100% { opacity: 1; }
}
@-moz-keyframes fadeIn {
0% { opacity: 0;}
100% { opacity: 1; }
}
@-o-keyframes fadeIn {
0% { opacity: 0; }
100% { opacity: 1; }
}
@keyframes fadeIn {
0% { opacity: 0; }
100% { opacity: 1; }
}
.fadeIn {
-webkit-animation: fadeIn 3s ease-in-out;
-moz-animation: fadeIn 3s ease-in-out;
-o-animation: fadeIn 3s ease-in-out;
animation: fadeIn 3s ease-in-out;
}
.but-forum {
display: inline-block;
padding: 10px 30px;
text-decoration: none;
text-shadow: 0 2px 2px #000;
color: #FFF;
font-family: 'Perpetua Titling MT', sans-serif;
font-size: 12px;
margin: -22%;
margin-left: 60%;
}
.but-forum:hover {
text-decoration: underline;
text-shadow: 0 0 8px #fff;
color: #000;
cursor: pointer;
}
.but-forum2 {
display: inline-block;
padding: 10px 30px;
text-decoration: none;
text-shadow: 0 2px 2px #000;
color: #FFF;
font-family: 'Perpetua Titling MT', sans-serif;
font-size: 12px;
margin: -22%;
margin-left: 20%;
}
.but-forum2:hover {
text-decoration: underline;
text-shadow: 0 0 8px #fff;
color: #000;
cursor: pointer;
}
.but-forum3 {
display: inline-block;
padding: 10px 30px;
text-decoration: none;
text-shadow: 0 2px 2px #000;
color: #FFF;
font-family: 'Perpetua Titling MT', sans-serif;
font-size: 12px;
margin: -22%;
margin-left: 20%;
}
.but-forum3:hover {
text-decoration: underline;
text-shadow: 0 0 8px #fff;
color: #000;
cursor: pointer;
}
h1 {
font-size:40px;
text-align: center;
font-family: 'Perpetua Titling MT', tahoma, sans-serif;
text-shadow: 0 2px 2px #000;
color: #2F4F4F;
margin-top: 25%;
}
p {
text-align: center;
fonte-size: 10px;
font-family: 'Perpetua Titling MT', tahoma, sans-serif;
color: #fff;
text-shadow: 0 2px 2px #000;
}
</style>
<body class="fadeIn" onkeydown="return false">
<h1>Teste de Fórum</h1>
<p>Web Designer & Desenvolvedor da página</p>
<a href="" class="but-forum"><b>Ir Fórum</b></a><b>
<a href="" class="but-forum2"><b>Portal</b></a><b>
<a href="" class="but-forum3"><b>Loja</b></a><b>
<a href="" class="but-forum3"><b>Cadastre-se</b></a><b>
<a href="" class="but-forum3"><b>Login</b></a><b>
</body>
</html>
Aí está o HTML, já tentei arrumar pelo CSS, mas nada ainda. Se alguém poder me ajudar, ficarei grato!
Endereço do meu fórum:
http://