web/lang/css.md

1.3 KiB

CSS

Size

px | Pixeles
mm | Milimetros
pt | Puntos

// ! 16px por defecto | Depende del navegador
em | Herrencia [Del contenedor] px

rem | Referencia el root

vw | Viwport width [Depende de la pantalla]
vh | Viwport height [Depende de la pantalla]

% | Porcentaje

Template

* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}
* {
	margin: 0;
	padding: 0;
	box-sizing: border-box;
}

/* Movil */


/* Tablet */
@media (min-width: 600px) {

}

/* Desktop 1 */
@media (min-width: 900px) {

}

/* Desktop 2 */
@media (min-width: 1200px) {

}

border

border-radius

Flex

.div-flex {
    display: flex;
}

flex tag

Flex equivalent

flex: 1;

flex: 1 1 0%;

flex-grow: 1;
flex-shrink: 1;
flex-basis: 0%;

Order

justify-content: center;
align-items: center;

Example

Center horizontal
<--------x-------->
justify-content: center;

 
Center vertical
^
|
|
x
|
|
v
align-items: center;

Zoom

/* <percentage> values */
zoom: 50%;
zoom: 200%;

/* <number> values */
zoom: 1.1;
zoom: 0.7;

/* Non-standard keyword values */
zoom: normal;
zoom: reset;

/* Global values */
zoom: inherit;
zoom: initial;
zoom: revert;
zoom: revert-layer;
zoom: unset;