10 Dic

CSS3 tips

Responsive viewport units (vw, vh, and vmin)

article > section {
    column-width: 22rem;
    column-gap: 2.6rem;
    height: 80vh;
    width: 80vw;
    overflow: scroll;

object-fit: cover

img {
width: 200px;
height: 400px;
object-fit: cover;


img {
  position: absolute;
animation: turn 2s infinite;
.donut-front {
  z-index: 5;
  backface-visibility: hidden;
@keyframes turn {
  to {
  transform: rotateY(360deg);



rem Relative to font-size of the root element
em Relative to the font-size of the element (2em means 2 times the size of the current font)


p:nth-child(odd) {
background: red;

p:nth-child(even) {
background: blue;

p:nth-child(3n+0) {
background: red;

Using a formula (an + b). Description: a represents a cycle size, n is a counter (starts at 0), and b is an offset value.

Specifying two sizes in CSS font property

font: 14px/60px


font-size: 14px;
line-height: 60px;

Link Utili