elhacker.net cabecera Bienvenido(a), Visitante. Por favor Ingresar o Registrarse
¿Perdiste tu email de activación?.

 

 


Tema destacado: Security Series.XSS. [Cross Site Scripting]


+  Foro de elhacker.net
|-+  Programación
| |-+  Desarrollo Web (Moderador: #!drvy)
| | |-+  Texto responsive en BOOTSTRAP 3
0 Usuarios y 1 Visitante están viendo este tema.
Páginas: [1] Ir Abajo Respuesta Imprimir
Autor Tema: Texto responsive en BOOTSTRAP 3  (Leído 10,399 veces)
Patrick Bateman

Desconectado Desconectado

Mensajes: 8


Ver Perfil
Texto responsive en BOOTSTRAP 3
« en: 23 Noviembre 2016, 12:21 pm »

Hola,

Estoy desarollando una web responsive con bootrap 3. Todo va como la seda pero al abrirla desde un smartphone creo que la letra queda demasiado pequeña.
Si modifico su tamaño queda demasiado grande en pantalla grande (pc/tablet).

Al no poder modificar las media queries para aplicar tamaño de letra responsive, ya que el código de bootsrap esta enlazado al CDN de google, no sé como hacerlo.

Alguien sabe que se suele hacer en estos casos??

Un saludo y gracias


En línea

#!drvy
Moderador
***
Desconectado Desconectado

Mensajes: 5.855



Ver Perfil WWW
Re: Texto responsive en BOOTSTRAP 3
« Respuesta #1 en: 23 Noviembre 2016, 15:37 pm »

Tus media-queries siempre tienen prioridad sobre las de bootstrap (mientras tu archivo css se cargue despues del de bootstrap).


La solucion normalmente se basa en utilizar em o rem como puntos de tamaño y aplicar X rm a cada tipo de resolucion.

Por ejemplo:

Código
  1. body { font-size: 16px; }
  2. .texto { font-size: 1em; }
  3.  
  4. @media (max-width: 320px) {
  5.   .texto { font-size: 2em; }
  6. }

En este caso, en una pantalla grande la clase .texto tendrá un tamaño de fuente de 16 pixeles mientras que si la pantalla tiene una resolución <= 320px de ancho, tendrá un tamaño de 32px.

Da igual lo que diga bootstrap mientras tu hoja de estilos se cargue despues de la suya.

Saludos


En línea

Patrick Bateman

Desconectado Desconectado

Mensajes: 8


Ver Perfil
Re: Texto responsive en BOOTSTRAP 3
« Respuesta #2 en: 23 Noviembre 2016, 18:39 pm »

Me olía que la cosa podía ir por ahí pero no estaba seguro.

La cosa es que todos los tamaños de letra ya los tengo en px primero y después en em, por si el navegador no reconociese los em.
El tema era que a pesar de estar así la letra seguía siendo pequeña. Imagino que el tamaño por defecto de body debe no ser sufciciente y luego las proporciones ya las toma sobre un tamaño pequeño por eso se me ocurrió modificar las media queries pero no sabía si podía "machacar" las de bootstrap sin que eso afectase en nada al diseño.

Pues probaré a ver...

Muchas gracias #drvy!!!
En línea

#!drvy
Moderador
***
Desconectado Desconectado

Mensajes: 5.855



Ver Perfil WWW
Re: Texto responsive en BOOTSTRAP 3
« Respuesta #3 en: 23 Noviembre 2016, 20:08 pm »

No te preocupes por las unidades em, hasta Internet Explorer 3 (ya va por la 11) los reconoce.

Saludos
En línea

Páginas: [1] Ir Arriba Respuesta Imprimir 

Ir a:  

Mensajes similares
Asunto Iniciado por Respuestas Vistas Último mensaje
Versión Responsive...
Sugerencias y dudas sobre el Foro
Kami 5 4,705 Último mensaje 24 Marzo 2014, 06:13 am
por flacc
diseño responsive
Desarrollo Web
kakashi20 3 2,479 Último mensaje 14 Abril 2014, 23:30 pm
por EFEX
Pasar web a responsive
Desarrollo Web
softmel 2 2,275 Último mensaje 10 Febrero 2015, 23:37 pm
por luchi
[Resuelto] Inicializar bootstrap-tooltip en Bootstrap v3.0.3
Desarrollo Web
DarK_FirefoX 0 3,712 Último mensaje 6 Abril 2015, 17:28 pm
por DarK_FirefoX
No puedo ocultar mi menu responsive Bootstrap
Desarrollo Web
SrTrp 0 2,843 Último mensaje 24 Diciembre 2020, 20:21 pm
por SrTrp
WAP2 - Aviso Legal - Powered by SMF 1.1.21 | SMF © 2006-2008, Simple Machines