Necesito poner en mi sitio div que es exactamente 25 cm de ancho (10 pulgadas) en cada pantalla. Cómo puedo hacerlo ?ancho Div en cm (pulgada)
Respuesta
Usted puede simplemente utilizar la unidad cm
en CSS:
#mydiv { width: 25cm; }
Tenga en cuenta que, como otros, ha señalado, el resultado sigue dependiendo de la lectura correcta del tamaño del monitor por el sistema operativo.
Véase el spec para más información.
Simplemente probé esto; el resultado no es ni cerca del número indicado. Además, ** unidad ** no ** sufijo **. –
Bueno, funciona en mi portátil 3yo asus para el mm. No tengo estadísticas listas, pero supongo que las computadoras portátiles generalmente tendrán más posibilidades de éxito. – Tomas
Todavía no creo que los navegadores lo rendericen correctamente, pero vale la pena intentarlo. Pero tendrá que probarlo con una variedad de combinaciones de plataforma/monitor antes de poder estar seguro de que está funcionando correctamente. – Spudley
¿Cómo puedo hacerlo?
No puede.
Actualización: aparentemente, puede hacerlo en muchos sistemas modernos: vea la respuesta de @Tomas. Sin embargo, parece no ser siempre completamente confiable.
Respuesta anterior: No puede. Los monitores muestran diferentes números de píxeles. El tamaño del píxel varía mucho de un monitor a otro.
Existen formas de interpolar el tamaño del píxel si conoce el tamaño del monitor. Esta información a veces está disponible para el sistema operativo; sin embargo, es imposible que un sitio web consiga esta información.
El único camino a seguir sería hacer que el usuario realice una calibración. Por ejemplo, solicite al usuario que sostenga un trozo de papel A4 en el monitor y use una regla que se pueda arrastrar para determinar el área que cubre. Usando esa información, puede calcular cuántos píxeles necesitará para mostrar 25 centímetros.
Actualización: @Tomas afirma en su respuesta que el uso de valores CSS cm
funciona en la pantalla.
Esta es, de hecho cierto en mi Windows 7 y 23" Plug & Juego Monitor TFT (1920x1080 píxeles): (!) 21cm
traduce perfectamente al lado corto de una hoja de papel A4 en Chrome 7, IE6, IE7, Firefox 3.6.
No parece ser completamente confiable, aunque: @Yi Jiang no puede hacer que funcione en una TFT usando Ubuntu Linux, también, los monitores más antiguos pueden no enviar a través de su información de tamaño para que ' ll ser imposible para el sistema operativo para determinar un tamaño correcto.
Aquí es un simple JSFiddle para la prueba.
No estoy de acuerdo.En la mayoría de los sistemas, el sistema operativo puede detectar correctamente el tamaño del monitor y se pueden usar valores absolutos de CSS. – Tomas
@Tomas No confío en que los navegadores traduzcan correctamente los valores de 'cm', incluso si pudieran. Pero punto justo, lo probaré –
@Tomas: "el tamaño del monitor se puede detectar" ... en píxeles, que no tienen una asignación directa a las unidades de ancho físico. Una pantalla de 17 "puede mostrar 640x480 y 1024x768, ¿cómo se obtiene el tamaño físico cuando se ejecuta el código en una página web? (Pista: no) – Piskvor
Necesitará obtener la resolución de la pantalla y el dot pitch del monitor para poder calcular esto.
Dados estos dos valores, podrá calcular el número de píxeles que necesita.
Sin embargo, no puede obtener esta información de un sitio web.
No se puede obtener la información de un sitio web, en cualquier caso. En un programa de Windows, podría ser posible ible (Windows 7 parece saber qué tan grande es mi pantalla). –
@Pekka: Sí, una aplicación de escritorio podría obtener esa información, ya que se puede comunicar directamente con el monitor y la tarjeta gráfica. Pero el navegador no puede, y eso es lo que hizo la pregunta. – Spudley
@Spudley Relax. No estaba criticando la respuesta de Chris, solo agregué una nota al margen –
creo que el motor de la disposición tendría que saber tres cosas para que esto sea posible:
- Resolución de pantalla
- DPI
- tamaño del monitor física
En lo que a mí consciente, no conoce los tres.
No dos de los anteriores son suficientes para calcular el tercero. – Tomas
DPI es puntos por pulgada. 1/DPI es pulgadas por punto. Eso solo es suficiente para calcular. Por lo tanto, necesita 2. o 1. y 3. –
y me equivoqué: los monitores más nuevos informan su DPI al SO, y los navegadores realmente lo detectan. http://en.wikipedia.org/wiki/Extended_display_identification_data – Piskvor
Dado que declara que es <div>
en un sitio, sabemos que se encuentra en un entorno de navegador web.
Lamentablemente, el navegador web no tiene forma de averiguar el DPI de la pantalla.Puede averiguar cuál es la resolución de la pantalla, para saber si el usuario tiene 1024x760 o lo que sea, pero nunca sabrá si esos 1024x768 píxeles se muestran en una pantalla de tamaño iPhone o en una valla publicitaria, o cualquier cosa intermedia.
Disculpa.
No puede. Un programa solo puede obtener las dimensiones físicas reales de una pantalla al interrogar a EDID ya que los valores devueltos por la API de Windows no son confiables. Un programa puede obtener los valores verdaderos para la resolución (por ejemplo, 1280 x 1024) y la pantalla de dpi, pero los navegadores no pueden hacer nada de esto por sí mismos.
Hay una confusión constante entre el "dpi física" de una pantalla y "dpi pantalla". El dpi físico, más propiamente llamado píxeles por pulgada, se obtiene dividiendo el ancho máximo de píxeles de la pantalla por el ancho físico (regla) en pulgadas. Los píxeles por pulgada están fijados por el proceso de fabricación. La pantalla dpi es un número que el usuario puede configurar a través del Panel de control y su único propósito es convertir un valor en pulgadas en una cantidad de píxeles. El valor de dpi de la pantalla configurable por el usuario no tiene ninguna relación directa con los ppp físicos (píxeles por pulgada) y es solo un número con un valor predeterminado de 96. No hay nada mágico en 96 o 120
Número de píxeles de pantalla = número de pulgadas x píxeles en pantalla
Es así de simple. El motivo 21 cm en un monitor de 23 pulgadas a 1920 x 1080 "se traduce" al ancho de una hoja A4 (21 cm) es porque con una diagonal de 23 pulgadas el ancho de la pantalla es de 20.05 pulgadas y 1920 píxeles en el la densidad de píxeles es de 95,76 píxeles por pulgada.
Con valor predeterminado de dpi de pantalla de 96, entonces para una pulgada: píxeles = 1 x 96 = 96 píxeles
La densidad de píxeles de la pantalla de 23 pulgadas es de 95,76 píxeles por pulgada, que coincide con el número de píxeles que se obtienen al especificar una longitud de una pulgada, con el valor de ppp de pantalla predeterminado de 96.
Si la ppp de la pantalla se cambia en el Panel de control o se cambia la resolución del video del monitor, entonces 21 cm no coincidirían con el ancho de una hoja de A4.
¡Gran explicación sobre los antecedentes técnicos! Tienes razón: funciona en Ubuntu Linux 10.04 (tarjeta de gráficos Intel) con una pantalla externa de 1920x1200 de 24 "solo por accidente, simplemente teniendo suerte con los 96 ppp codificados. El tamaño con la pantalla interna del portátil (alta densidad) es totalmente incorrecto: el el rectángulo del ejemplo A4 se muestra como demasiado pequeño. – geekQ
- 1. wkhtmltopdf css tamaños en cm/mm
- 2. Determine el ancho de un ancho DIV dinámico Multivolpea de DIV 3 ancho de columna fijo
- 3. Div ancho fijo en la izquierda y div ancho fluido en la derecha
- 4. div con un ancho desconocido
- 5. CSS - ancho fijo SPAN/div
- 6. ¿Cómo dar a un cuadro de texto un ancho fijo de 17,5 cm?
- 7. ¿Cómo agregar un div de ancho fijo al lado de un div de ancho automático?
- 8. Div ancho fijo a la izquierda, relleno ancho restante div a la derecha
- 9. Div izquierdo 200px ancho, contenido div el resto?
- 10. Center Div dentro de otro (100% de ancho) div
- 11. una div ancha con ancho ilimitado
- 12. Ancho de pantalla completa área div
- 13. conseguir ancho de un elemento div
- 14. Diseño de CSS - Ancho dinámico DIV
- 15. centrando un div sin establecer el ancho
- 16. ¿Relleno agrega a div ancho/alto?
- 17. ¿Cómo limitar el ancho de div?
- 18. ancho de barra de desplazamiento div
- 19. Dos columnas div. Ancho dinámico de uno
- 20. Configuración de ancho y alto de DIV en JavaScript
- 21. Extender una anchura div en base a sus hijos ancho
- 22. ¿Cortar texto en un div si excede el ancho establecido?
- 23. Div con ancho fijo de representación demasiado ancho en el ipad
- 24. ¿El contenido de div es más largo que div cuando el ancho está establecido en 100%?
- 25. El ancho de div con la posición absoluta depende del ancho de sus padres?
- 26. css ancho div 100% no ocupa todo el ancho del elemento principal
- 27. ancho DIV inmediatamente después de agregar es calcular mal?
- 28. 100% ancho de DIV no es realmente 100%
- 29. CSS - div ancho, dependiendo del tamaño de las imágenes anteriores
- 30. si un div es un ancho del 100% por defecto
¿Por motivos de impresión o en la pantalla? Tenga en cuenta que –
25cm <> 10in mientras que 25.40 es más cercano (1cm = .3907008in redondeada) –
Me intriga: ¿por qué usted realmente quiere hacer esto? ¿Estás tratando de imitar, por ejemplo, una pantalla de "tamaño real" de un objeto de la vida real? –