Hola gente bueno estoy haciendo una index algo asi:
Código:
<!DOCTYPE>
<html>
<head>
<meta charset='utf-8'>
<link rel='stylesheet' type='text/css' href='/css/style.css'>
</head>
<body>
<header>
<div class='barline'>
<a href="#home" id='logo'></a>
<form id='loginformitem' name='loginformitem' method='post'>
</div>
<input type='text' name='username' placeholder='Nombre de usuario' />
<input type='password' name='password' placeholder='Contraseña' />
<button type='submit'>Conectate</button>
</div>
</form>
</header>
<div id='footer'>
<p>© 2013 - Las imágenes y diseño de este sitio web pertenecen a <a href='http://'
>MonsterCMS</a>. Todos los derechos reservados.</p>
</div>
</body>
</html>
Código:
body {
background: url(../images/background.gif);
font-family:'Segoe UI';
height:100%;
}
body, body * {
margin:0;
padding:0;
}
/*Linia arriba*/
div.barline {
width:100%;
height:100px;
background:#000000;
position:relative;
z-index:10;
overflow:hidden;
opacity: .75;
-moz-opacity: .75;
}
#logo {
position:absolute;
width:110px;
height:40px;
background-image:url(../images/logo.png);
left:32px;
top:27px
}
/*Linea footer*/
#footer{
position:fixed;
left:0px;
bottom:0px;
height:50px;
width:100%;
background:#000000;
opacity: .75;
-moz-opacity: .75;
}
#footer p {
background: rgba(0,0,0,0.0);
top:30px;
width:900px;
height:100px;
margin:15px auto;
top:30px;
display:block;
color:#fff;
}
#footer a {
color:#fff;
}
En el <div class='barline'> quiero algo de opacidad pero sin que el logo se opaque como lo hago...
Me refiero en el momento que pongo la opacidad de la barra el logo igual se opaca y no quiero como lo hago?