HTML Cheatsheet para la clase de Construcion de Software version 1.0
La propiedad border crea un contorno alrededor del elemento al cual se le especifica el tamaƱo (ancho del borde), estilo y color
Ej. borde: 5px solid orange;
La propiedad de border tambien se puede especificar por lados utilizando border-top, border-right, border-bottom y border-left. Estos siguen la misma estructura que un border normal pero haciendo enfasis en una cara del elemento
Ej.
border-top: 12px solid green;
border-right: 5px solid blue;
border-bottom: 9px solid yellow;
border-left: 7px solid red;
La propiedad border-radius redondea las esquinas del elemento seleccionado acorde a una medida ya sea de pixeles, porcentaje u otra unidad
Ej. border-radius: 10px;
La propiedad color establece el color de la letra dentro del elemento seleccionado
Ej. color: purple;
La propiedad font esa una propiedad "shorthand" que establece diferentes parametros de la fuente del elemento seleccionado
Ej. font: italic 1em "Fira Sans", serif;
La propiedad font-family establece la fuente o familia de fuentes que se utiliza en el elemento seleccionado
Las propiedades font-style y font-weight establecen el estilo (normal, italica) y el peso (normal, bold) de la fuente
Ej.
font-style: italic;
font-weight: bold;
Las propiedad width y height modifican el ancho y el alto del elemento seleccionado por las unidades que se especifiquen
Ej.
width: 150px;
height: 225px;
La propiedad list-style es "shorthand" y modifica el estilo de una lista
Ej. list-style: url(/images/icons8-monkas-48.png) inside;
La propiedad margin establece el margen del elemento seleccionado, esto es el espacio que se genera del elemento hacia afuera
Ej. margin: 100px;
La propiedad padding establece el padding del elemento seleccionado, esto es el espacio que se genera del elemento hacia adentro
Ej. padding: 60px;
La propiedad overflow establece el comportamiento del contenido que genere overflow (que se salga de su caja)
Ej. overflow: scroll;
La propiedad display establece si el elemento se ha de tratar comom bloque o como inline
Ej. display: flex;
La propiedad position establece la posicion del elemento seleccionado en el documento determinado por valores de top, right, bottom, left
Ej. position: relative;
top: 15px; left: 60px; bottom: 20px; right: 10px;
La propiedad filter apica efectos graficos al elemento selecionado como blur, color shift, grayscale, etc
Ej. filter: invert();