Как делать отступы в HTML?

Для внутренних отступов есть свойства padding, для внешних margin.

Можно задать с какой-либо одной стороны padding-left, padding-right, padding-top, padding-bottom, для margin аналогично.

Например:

/* внешний отступ слева 15px */

margin-left: 15px;

/* внутренний отступ снизу 45px */

padding-bottom: 45px;

Можно использовать сокращенные записи, например:

/* внутренний отступ со всех сторон 20px */

padding: 20px;

/* внешний отступ сверху и снизу 10px, справа и слева 20px */

margin: 10px 20px;

/* внутренний отступ сверху 10px, справа и слева 20px, снизу 30px */

padding: 10px 20px 30px;

/* внешние отступы сверху 10px, справа 20px, снизу 30px, слева 40px */

margin: 10px 20px 30px 40px;

Важно не забывать, что отступы действуют ожидаемо только для блочных элементов. Для строчных элементов лучше не задавать вертикальных отступов, так как они ведут себя непредсказуемо. В то же время можно пользоваться горизонтальными.

Еще есть интересный эффект как схлопывание отступов. Подробнее можно разобраться пройдя курс https://htmlacademy.ru/courses/44 Блочная модель документа от HTML Academy