Saludos, tengo un pequeño problema, estoy intentando aplicar un borde con imagen, es una practica del libro que estoy leyendo, aunque lo escribo, en el navegador no se refleja, he revisado y he escrito todo como dice en el libro y en w3school, no se cual sea el problema.
El código CSS:
Código:
body {
text-align: center;
}
#principal {
display: block;
width: 500px;
margin: 50px auto;
padding: 15px;
text-align: center;
border: 29px;
-moz-border-image: url(border.png) 29 stretch;
-webkit-border-image: url(border.png) 29 stretch;
-border-image: url(border.png) 29 stretch;
background: #DDDDDD;
-moz-border-radius: 20px / 10px;
-webkit-border-radius: 20px / 10px;
border-radius: 20px / 10px;
-moz-box-shadow: rgb(150,150,150) 5px 5px;
-webkit-box-shadow: rgb(150,150,150) 5px 5px;
box-shadow: rgb(150,150,150) 0px 0px 10px;
background: -webkit-radial-gradient(center, circle, #FFFFFF 0%, #006699 200%);
background: -moz-radial-gradient(center, circle, #FFFFFF 0%, #006699 200%);
}
#titulo {
font: bold 36px FreeSerif, verdana, sans-serif;
text-shadow: rgba(0,0,0,0.5) 3px 3px 5px;
color: hsla(120, 100%, 50%, 0.5);
}
@font-face {
font-family: "FreeSerif";
src: url("FreeSerif.ttf");
}
Aqui el Código HTML:
Código:
<!DOCTYPE html>
<html lang="es">
<head>
<title>Nuevos Estilos CSS3</title>
<link rel="stylesheet" href="nuevocss3.css">
</head>
<body>
<header id="principal">
<span id="titulo">Estilos CSS Web 2.0</span>
</header>
</body>
</html>
La imagen que estoy utilizando es esta:
Le cambié el nombre a "border.png" para trabajar en mi ejercicio.
Espero sus respuestas, gracias de antemano :).