1

vengo trabajando en un div de bienvenida para mi pagina, el problema esque los h1 se ven demasiados pequeños, mi duda seria agrandar hasta el boton a un tamaño comprensible

este es la imagen que me genera con el codigo actual :

introducir la descripción de la imagen aquí

Adjunto mi codigo HTML

<div class="modal fade" id="portfolioModal-19" tabindex="-1" role="dialog" aria-labelledby="myModalLabel-12" aria-hidden="true">                                  
                                    <div class="modal-content text-white">
                                        <div class="close" data-dismiss="modal">
                                            <div class="lr"><div class="rl"></div></div>
                                        </div>
                                        <div class="container">
                                            <div class="modal-body">
                                                <div class="col-md-8 col-md-offset-2" align="center">
                                                    <div class="modal-header">
                                                        <h1  class="modal-title" >BIENVENIDOS</h1>
                                                        <br>
                                                        <h1 class="modal-title" > A </h1>
                                                        <br>                                                                
                                                        <h1 class="modal-title" ><span class="text-main">LCN PERÚ</span></h1>
                                                        <div class="divider divider-sm divider-icon divider-white">//</div>
                                                    </div>
                                                </div>
                                                <div class="col-md-8 col-md-offset-2" align="center">
                                                    <button type="button" class="btn btn-main" data-dismiss="modal"><i class="fa  fa-hand-o-up"></i> Entrar</button>
                                                </div>
                                            </div>
                                        </div>
                                    </div>
                                </div>
4
  • Puedes hacerlo con css apuntando a tu h1 usando la clase modal-title h1.modal-title{ font-size: XXpx}
    – Yikarus
    Commented el 25 may. 2017 a las 21:58
  • Pero eso descuadra a mis otros H1 Commented el 25 may. 2017 a las 21:59
  • Puedes hacer que al h1 quieres apuntar asignarle un id y usarlo en vez de la clase o el tag de html
    – Yikarus
    Commented el 25 may. 2017 a las 22:02
  • @Ivan, quitale <div class="container"> y su </div> que esta dentro de tu modal, luego podes usar los estilos que te indican. Commented el 26 may. 2017 a las 15:40

3 respuestas 3

1

Puedes agregar la propiedad de font-size en un titulo especifico de esta forma:

<h1  class="modal-title" style="font-size: 100px" >BIENVENIDOS</h1>

Y así no alteras los demás h1

2
  • Gracias, espero que votes un +1 Commented el 26 may. 2017 a las 1:02
  • @IvanMoreFlores Cuidado al agregar estilos inline. Pueden darte problemas en un futuro. Deberías de usar IDs o clases para agregar estilos y tener separados tus estilos del HTML. Commented el 27 may. 2017 a las 11:54
0

Si lo que quieres es hacer referencia únicamente a un h1 y modificarle su tamaño puedes asignarle un ID (que hace referencia a un h1 únicamente) y asignarle un tamaño mediante la propiedad font-size.

Ejemplo:

#grande{
   font-size: 50px;
   color: red;
}
<h1> Este es el tamaño normal <h1>
<h1 id="grande">Este es un tamaño mas grande de lo normal</h1>

0

Si quieres aumentar el tamaño de esos tres, podrías agregarles una clase y luego darle las propiedades que quieras, ejemplo:

h1.titulo-grande {
  font-size: 48px;
}
<div class="modal-header">
  <h1  class="modal-title titulo-grande" >BIENVENIDOS</h1>
  <br>
  <h1 class="modal-title titulo-grande" > A </h1>
  <br>                                                                 <h1 class="modal-title titulo-grande" ><span class="text-main">LCN PERÚ</span></h1>
  <div class="divider divider-sm divider-icon divider-white">//</div>
</div>

Tu Respuesta

By clicking “Publica tu respuesta”, you agree to our terms of service and acknowledge you have read our privacy policy.

¿No es la respuesta que buscas? Examina otras preguntas con la etiqueta o formula tu propia pregunta.