CSS Media Queries

Media queries de CSS

Saludos el día hoy les traigo una breve explicación de lo que son los media queries y porque son tan importantes a la hora de hacer que tu pagina web sea adaptable a cualquier dispositivo, existen diversas herramientas para realizar pruebas y darse cuenta como sera el aspecto en cada dispositivo... ya sean tablets, smartphones, pc de escritorio y laptops, cada uno cuenta con una resolución diferente según el tamaño de su display, este esta regido por el numero de pixeles que puede mostrar, esta es quizás una de las razones mas importantes de la creación de media queries.

a continuación les dejo un vídeo que explica como son y para que usan y  un ejemplo de código CSS.

Ejemplo:

@media (min-width: 768px) {
  .container {
    width: 750px;
  }
}
@media (min-width: 992px) {
  .container {
    width: 970px;
  }
}
@media (min-width: 1200px) {
  .container {
    width: 1170px;
  }
}

El código anterior esta definido para cambiar la clase "container". según el ancho de la pantalla del dispositivo en el que se esta mirando.

nos vemos en mi próxima entrada que hablara de los selectores y atributos de CSS y de que manera controlar cada uno de los elementos de tu pagina.

Read More

transiciones y transformaciones CSS

Saludos amigos, el dia de hoy veremos lo que son las transiciones y transformaciones en CSS3, que estas nos son de mucha utilidad cuando queremos darle un estilo mas profesional y dinamico a nuestra web, estos efectos son utilizados principalmente en menus.

Ejemplo:

.a:over {
  transition-property: opacity, left, top, height;
  transition-duration: 3s, 5s;
}

El codigo anterior se aplica a la clase "a" que al pasar el mause por encima de ella se activara y comenzara a hacer su trabajo.

Read More

Prefijos de CSS

Saludos amigos, el día de hoy veremos lo que son los prefijos de CSS.

Bien si alguna vez te has preguntado porque en diferentes paginas web dice una leyenda que dice:"esta pagina se ve mejor en chrome o en mozilla firefox u opera", la razón de lo anterior es simple, cada navegador tiene su propia forma de interpretar el código de la pagina web que estas visitando, la razón de ello es que existe una norma que establece  el consorcio World Wide Web (W3C).

Existen ciertas reglas de CSS que no son reconocidas aun por dicha organización y los desarrolladores de dichos navegadores se adelantan para que las paginas web sean cada vez mas amigables a la vista del usuario.

En el siguiente vídeo se explica a detalle de lo que son los prefijos de css.

https://www.youtube.com/user/packo6300 

Read More

Introducción al CSS

Saludos amigos, aquí les traigo un vídeo que explica lo que es el CSS3 (hojas de estilos en cascada), poco a poco iré subiendo los demás vídeos por lo pronto aquí tienen el primer vídeo que explica su historia y como es que fue naciendo la necesidad de ir mejorando este lenguaje, que es de gran utilidad al momento de personalizar nuestras paginas web.

no olviden suscribirse!! a mi canal de youtube saludos

packo6300

Read More