Hola, he leido varios post sobre el tema de las barras pero no encontraba las barras que yo quería, por lo que las he hecho yo y ahora las comparto.
Las barras son flotantes y fijas en el top de modo que aunque se haga scroll, siempre estará visible. Estas barras son útiles para mostrar información en todo momento. Tambien tienen un poco de transparencia y el fondo en color degradado.
Unas muestras.
Naranja
Verde
Azul
Para colocar el estilo, hay que editar el fichero global.css de tu tema por defecto y añadir el siguiente código...
Código:
.barracentro {
position:fixed;
font-family: Arial, Helvetica, sans-serif;
font-size: 1.5ex;
float: left;
z-index: 10000;
width:100%;
height:auto;
top: -11px;
left:0px;
text-align: center;
vertical-align: middle;
padding:3px;
opacity:0.90;
}
.naranja{
border:1px solid #b95f08;
background-color:#DF6E00;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#DF6E00', endColorstr='#b95f08');
background: -webkit-gradient(linear, left top, left bottom, from(#DF6E00), to(#b95f08));
background: -moz-linear-gradient(top, #DF6E00, #b95f08);
color: #fff;
}
.azul{
border:1px solid #02306a;
background-color:#23528c;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#23528c', endColorstr='#02306a');
background: -webkit-gradient(linear, left top, left bottom, from(#23528c), to(#02306a));
background: -moz-linear-gradient(top, #23528c, #02306a);
color: #fff;
}
.verde{
border:1px solid #165e1d;
background-color:#2b8433;
filter: progid:DXImageTransform.Microsoft.gradient(startColorstr='#2b8433', endColorstr='#165e1d');
background: -webkit-gradient(linear, left top, left bottom, from(#2b8433), to(#165e1d));
background: -moz-linear-gradient(top, #2b8433, #165e1d);
color: #fff;
}
Una vez editada (y guardada) la hoja de estilos
global.css hay que ir a las plantillas, seleccionar la plantilla que estés usando, expandir la sección
cabecera - plantillas y seleccionar la plantilla
header.
Una vez dentro del editor de la plantilla, escribe
Código:
<p class="barracentro azul">texto para mostrar</p>
Lo puedes colocar donde quieras, ya que el estilo CSS se encarga de ponerlo siempre arriba del todo.
Si quieres cambiar el color, donde pone
Código:
<p class="barracentro azul">texto para mostrar</p>
lo puedes cambiar por
Código:
<p class="barracentro naranja">texto para mostrar</p>
Código:
<p class="barracentro verde">texto para mostrar</p>
Creo que es todo. Si las queréis ver funcionando, puedes visitar mi foro
http://www.bankiarroba.com
Un saludo.
ACTUALIZADO
He actualizado el código para que la anchura se adapte para contener todo el texto. Es decir, si el texto que pones ocupa varias líneas, la barra se adaptará para cubrir todas las líneas.
He cambiado height:auto; y padding: 3px;
MyBB-Es.com - Soporte para los Foros MyBB en Español
»
Recursos para MyBB
»
Guias y tutoriales 
»
Barra fija flotante top CSS
Barra fija flotante top CSS
vcode
Ignnacio
, es básico pero funcional.
(y dudas¿?)
