Como lo haríais, porque por mas vueltas que le doy no soy capaz de conseguirlo.
gracias de antemano
20/03/2011, 04:35
| ||||
| ||||
| como poneis un banda-decorativa debajo de un texto? Quisiera meter una banda negra debajo de un texto-titular que va en blanco. Algo asi: Como lo haríais, porque por mas vueltas que le doy no soy capaz de conseguirlo. gracias de antemano |
|
20/03/2011, 07:32
| ||||
| ||||
| Respuesta: como poneis un banda-decorativa debajo de un texto? Indica un background-color al elemento que quieras aplicarle la banda negra. Por ejemplo:
Código CSS:
Ver original
__________________ Marcelo López Santa ------------------------ Diseñador y programador web www.sixtudio.com |
|
20/03/2011, 08:44
| ||||
| ||||
| Respuesta: como poneis un banda-decorativa debajo de un texto? ya pero con eso no podria decirle cuanto quiero que mida de alto esa banda ni tampoco extenderla a todo el ancho de la linea de texto y mas aún en este titular que son dos palabras. |
|
20/03/2011, 09:15
| ||||
| ||||
| Respuesta: como poneis un banda-decorativa debajo de un texto? pss como te indican...
Código CSS:
no veo la complicacion... esa es una manera pero hay muchas... Ver original 
__________________ Toroflix - movies. |
|
20/03/2011, 09:38
| |||
| |||
| Respuesta: como poneis un banda-decorativa debajo de un texto? la verdad es que no me gusta tener codigo css aparte de donde van los estilos me pierdo mucho al revisar el codigo... yo lo haría con un div:
Código HTML:
Ver original Espero que no me haya equivocado.  Buena suerte amigo...  |
|
20/03/2011, 09:46
| ||||
| ||||
| Respuesta: como poneis un banda-decorativa debajo de un texto? Cita: para eso estan las hojas de estilo para estar separadas al markup... pero bueno
Iniciado por APadin  la verdad es que no me gusta tener codigo css aparte de donde van los estilos me pierdo mucho al revisar el codigo... yo lo haría con un div:
Código HTML:
Ver original Espero que no me haya equivocado. Buena suerte amigo... pasate por aqui para entender mas el por que. http://www.librosweb.es/css/index.html id="test" faltaron las " " y es style no stile
__________________ Toroflix - movies. |
|
20/03/2011, 13:04
| ||||
| ||||
| Respuesta: como poneis un banda-decorativa debajo de un texto? he probado lo que me comentas alexk. Y si me funciona pero siempre y cuando lo ponga fuera del div. Si lo meto dentro del div no me funciona. Bueno si funciona pero con los margenes que lleve o el div o el parrafo. Y sino le aplico "parrafo" no me lo hace. no se si me he explicado bien. El tema es que yo quiero que vaya dentro del div. Las especificaciones que yo tengo creadas de margenes y demas no se las he aplicado a ese div sino al párrafo. Pero el resultado es el mismo que en el ejemplo que tu me has puesto. Me pasa lo mismo cuando lo meto dentro del div. Como solución, pero no me convence mucho, es que si pongo margen derecho hasta ocupar todo el ancho del div, si me lo hace, pero claro tendría que crear una class especifica para cada titular. Lo curioso es que funcione fuera del div pero no dentro. ¿porque? Última edición por 00israel; 20/03/2011 a las 13:18 |
|
21/03/2011, 12:53
| ||||
| ||||
| Respuesta: como poneis un banda-decorativa debajo de un texto? alexk a ver si puedes terminar de echarme una mano. Te lo agradeceria mucho. es que me he quedado en este punto encasillado y no consigo avanzar. No se si esto seria una solucion pero si en lugar de aplicarle al titulo la etiqueta <p> le aplico la etiqueta <pre> si que me funciona. Que diferencia habria entre p y pre. El problema es que ademas he variado toda la etiqueta p metiendole un margen de 15 pro todos los lados. Y no es muy buena idea. Con lo cual en este caso me salva la etiqueta <pre> que me dices? Última edición por 00israel; 21/03/2011 a las 13:05 |
|
21/03/2011, 15:28
| ||||
| ||||
| Respuesta: como poneis un banda-decorativa debajo de un texto? pues no entiendo su pones el codigo completo o mejor aun la URL del sitio en cuestion mejor.. por que hablas como si supiera todo lo que estas viendo pero no...
__________________ Toroflix - movies. |
|
22/03/2011, 13:10
| ||||
| ||||
| Respuesta: como poneis un banda-decorativa debajo de un texto? tienes toda la razon perdoname. mira este es un ejemplo donde he estado trasteando. Este es el XHTML: Código HTML: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"> <html xmlns="http://www.w3.org/1999/xhtml"> <head> <link href='http://fonts.googleapis.com/css?family=Raleway:100' rel='stylesheet' type='text/css'> <link href='http://fonts.googleapis.com/css?family=Cuprum' rel='stylesheet' type='text/css'> <meta http-equiv="Content-Type" content="text/html; charset=UTF-8" /> <title>prueba</title> <link href="layout1.css" rel="stylesheet" type="text/css" /> </head> <body> <div id="contenedor"> <div id="botones-titulares"> <p class="titulares-trabajo">Titulación<br /> Trayectoria Profesional<br /> Experiencia Docente<br /> <a href="publicaciones.html">Publicaciones</a> </p> </div> <div id="barra-texto"> <br/> <pre span class="titular-blanco-entexto">Trayectoría Profesional</pre> <p>Nueva York es posiblemente uno de los destinos más apetecibles para un turista, un lugar donde se entremezclan por igual recuerdos, sensaciones y realidad, tanto la primera vez que llegas a ella, como las ocasiones posteriores en que he tenido la oportunidad de visitarla, no en vano es la ciudad más utilizada como escenario cinematográfico en la historia del cine y la televisión. Así pues, uno tiene siempre la impresión de haber estado allí antes.<br /> <br /> </p> </div> <div id="creditos"> <div id="creditos-pilar">TERAPEUTA...</div> <div id="creditos-isra">Mapa del sitio | 2011 © | diseño...</div> <div id="final"></div> </div> </div> </body> </html>
Código:
@charset "UTF-8";
* {
margin: 0px;
padding: 0px;
}
#contenedor {
width: 734px;
margin-top: 310px;
margin-right: auto;
margin-left: auto;
position: relative;
}
#contenedor #creditos #creditos-pilar {
font-family: Cuprum, arial, serif;
font-size: 11px;
text-align: left;
float: left;
width: 340px;
padding-top: 12px;
padding-left: 25px;
}
#contenedor #creditos #creditos-isra {
font-family: Cuprum, arial, serif;
font-size: 11px;
text-align: right;
float: right;
width: 355px;
padding-top: 12px;
padding-right: 12px;
}
#contenedor #botones-titulares {
border-top-width: 2px;
border-top-style: solid;
border-top-color: #000000;
}
#contenedor #barra-texto {
background-color: #eeeeee;
width: 734px;
border-top-width: 2px;
border-bottom-width: 2px;
border-top-style: solid;
border-bottom-style: solid;
border-top-color: #000000;
border-bottom-color: #000000;
position: relative;
}
#contenedor #creditos #final {
clear: both;
height: 50px;
width: 734px;
}
a img {
border-top-style: none;
border-right-style: none;
border-bottom-style: none;
border-left-style: none;
}
p {
font-family: cuprum, arial, serif;
font-size: 15px;
margin-top: 15px;
margin-right: 25px;
margin-bottom: 15px;
margin-left: 25px;
font-style: italic;
color: #666666;
}
.grande {
font-family: raleway, sans-serif;
font-size: 18px;
font-style: normal;
color: #000000;
}
.titular-blanco-entexto {
font-family: Raleway, sans-serif;
font-size: 17px;
color: #FFFFFF;
background-color: #000000;
padding-left:25px;
vertical-align: middle;
padding-top: 5px;
padding-bottom: 2px;
}
.titulares-trabajo {
font-family: Arial, Helvetica, sans-serif;
font-size: 18px;
font-style: normal;
color: #999999;
}
|
| Etiquetas: Ninguno |
