Posts Tagged ‘Navegadores’

CSS Hack para Chrome y Safari

Friday, September 5th, 2008

[Vía Pinceladas Web]

Era inevitable y posiblemente será necesaria la aparición de un filtro o hack css que nos permita aplicar una determinada regla CSS que solamente entienda el nuevo navegador de Google, Chrome. El que presentamos a continuación también funciona en Safari, dado que ambos usan el motor de Webkit.

El hack se basa en el selector CSS "E:nth-of-type(n) " que selecciona el elemento (E) situado en la posición (n) de nuestro documento. Por ejemplo, div:nth-of-type(3) aplicaría la regla que definamos al tercer div que aparezca en nuestro documento. Con esta explicación espero que entendáis porqué funciona el siguiente filtro:

CSS:
  1. body:nth-of-type(1) div.caja {
  2.        background: blue;
  3. }

En este caso los div con un class "caja" del primer elemento "body" de nuestro documento se verán con fondo azul únicamente en Chrome y Safari.

Si queréis el codigo completo para probar...

HTML:
  1. <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
  2. <html xmlns="http://www.w3.org/1999/xhtml">
  3. <meta http-equiv="Content-Type" content="text/html; charset=iso-8859-1" />
  4. <title>Chrome CSS Hack Demo</title>
  5. <style type="text/css">
  6. div.caja {
  7.        border: 1px solid red;
  8.         width: 200px;
  9.         height: 200px;
  10. }
  11. body:nth-of-type(1) div.caja {
  12.     background: blue;
  13. }
  14. </style>
  15. </head>
  16.     <div class="caja">
  17.    
  18.     </div>
  19. </body>
  20. </html>

Pero que lectores mas Geek!

Friday, September 5th, 2008

Un leve vistazo a mis estadísticas de analytics entre los días 2-4 de este mes, sección navegadores, arroja unos datos en este blog que ya me gustaría ver a mi en el mundo real:

  • Firefox: 56.79%
  • Inernet Explorer: 18,58%
  • Chrome: 18,23%

Un vistazo rápido a otras webs mucho más generalistas y a cuyas estadísticas tengo acceso indican un uso de Chrome de un 1% y con Firefox manteniéndose entre el 16 y el 20%.

Insisto...soys unos geeks!

Primera vulnerabilidad de seguridad en Google Chrome

Wednesday, September 3rd, 2008

Según informan en Ryan Naraine & Dancho Danchev , Google Chrome hereda una vulnerabilidad importante, Carpet Bombing, del motor en el que se basa, Webkit.

El problema es que un atacante malintencionado puede engañar al usuario para que se descarge una aplicación Java y esta se ejecuta sin avisarle de que puede ser peligroso, sin advertencia alguna, vamos (demo no peligrosa aquí). A partir de aquí un hacker inteligente puede hacer que dicho programa Java simule una aplicación windows y engañarle para que acepte acciones potencialmente peligrosas.

Apple ya arregló este problema para Safari, pero parece que a Google se le ha escapado este problema, por lo que es muy probable que tengamos una nueva versión o algún parche en breve... pero desde luego no va a quedar muy bien.

Lo que más me ha gustado de las opiniones sobre Chrome

Wednesday, September 3rd, 2008

De los rios de bits que se han escrito sobre el nuevo navegador de Google...

Error 500

Lo siento por quienes se quejan de que "todo los blogs de tecnología están hablando de Chrome", creo que es como quejarse de que todos los blogs de fútbol hablasen de la Eurocopa. En juego está parte del futuro de la web...

Olga Carreras:

Lo siguiente que he buscado y me ha decepcionado no encontrar es alguna opción de accesibilidad (sin contar con la habitual posibilidad de incrementar o disminuir el tamaño de letra de las páginas).

Genbeta

Google quiere apostar fuerte por Chrome y lo demuestra haciendo algo que pocas veces se ve, modificando la página de inicio del buscador y mostrando un enlace para su descarga.

Css3.info

Chrome is based on the same version of Webkit as Safari 3.1 so should in theory have the same level of CSS support, although based on the very brief usage I’ve had of it so far it seems that text-shadow and @font-face aren’t working.

Google Dirson

La empresa de Bill Gates es el líder en el software de PC y quiere poco a poco 'atacar' la WWW, y Google es el líder de la WWW y quiere poco a poco 'atacar' el software de PC. Dos caminos opuestos que se cruzan en el navegador web...

Edans

El movimiento de Google, en realidad, es un auténtico sistema operativo: no compite con Firefox...

Ya se puede descargar el navegador de Google

Tuesday, September 2nd, 2008

Pues si... desde hace un rato se puede descargar el navegador más esperado en menos tiempo de todos los tiempos... Google Chromeeee!. Estoy seguro de que voy a ser el único en dar esta noticia... XD

Los usuarios de Mac tendremos que esperar... a menos que usemos alguna virtualización de Windows. Qué ostias, si ya estoy arrancando el Parallels.

2 mins después: ya lo estoy instalado... se baja un ficherito y en cuanto lo ejecutas comienza a descargar el programa completo. Al instalarlo lo primer que hace es traerse los marcadores de Firefox. Ups... ya lo tengo, ¡Qué emoción! Tripix se ve bien.

Imagen 4.png

Primeras sensaciones

Rapidito rapido... pero que muy rapidito... me gusta.

Una prueba... ¿Qué selectores CSS cogerá? voy a hacer el test css3.info. La leche... los pasa todos! ¿Y el acid2 test? Perfecto! esta gente se lo curra.

Otra cosa chula: estando en un sitio web puedes guardar un acceso directo en tu escritorio desde el propio navegador. Muy útil para cosas como Delicious o Gmail. Al lanzarlo desde el acceso directo te lo abre en Chrome pero en modo ventana, sin pestañas o barra de navegación.

Lo voy a dejar. Desde luego la primera sensación muy buena, sobre todo por la ligereza y su interfaz sencilla y sin elementos sobrantes. Este ha venido para quedarse.

Sombras en Firefox 3.1

Tuesday, September 2nd, 2008

Se acaba de anunciar que Geckgo 1.9.1, en el que se basa Firefox 3.1, soportará 3 nuevas propiedades CSS3:

  • -moz-box-shadow: dibuja sombras sobre una caja (ej.: -moz-box-shadow: 10px 10px 5px #888, 10px 10px 30px rgba(0,0,0,0.4); )
  • text-shadow: pone sombra a un texto (ej.: 0 0 24px blue, 0 0 4px blue, 1px 1px 2px #333; )
  • -moz-column-rule: permite dibujar una línea de separación entre columnas (en el caso de que estemos usando los columns de css3). Su sintaxis es la misma que la de la propiedad border de css2 (ancho,tipo,color)

Por cierto, en esta página se pueden ver, si usas Safari u Opera, como quedan estas propiedades relacionadas con las sombras.