• Publicar

Una vez para que entiendas la diferencia entre padding y margin

1076
0
2025-02-11 17:39:36
Prohibida la reproducción sin autorización del autor
29
13
25
3
Diferencia entre el relleno (padding) y el margen (margin) en CSS Definición y posición: ‌padding‌: El padding es el espacio dentro del elemento, situado entre el contenido del elemento y el borde. Se define en el interior del elemento y se utiliza para separar el contenido del borde. ‌margin‌: El margen es el espacio exterior del elemento, situado entre el borde del elemento y otros elementos. Se define en el exterior del elemento y se utiliza para separar el elemento de los elementos circundantes. Objeto de acción y efecto visual: ‌padding‌: Actúa sobre el propio elemento, cambiando la distancia entre el contenido interno y el borde. El padding aumenta el tamaño real del elemento, ya que se encuentra en su interior. ‌margin‌: Actúa sobre otros elementos alrededor del elemento, cambiando la distancia entre este y los demás elementos. El margen no afecta al contenido del elemento, solo ajusta el espacio exterior.
Estudio
CSS
Relleno
relleno
Margen
Margen
智步DataV Enviar mensaje
Web全栈开发可视化教程【开发、学习、分享】
Explicación animada de los puntos clave de CSS
（32/80）
93,4K reproducciones
Resumen
CSS Box-Sizing controla cómo se calcula el modelo de caja de un elemento.
00:15
La propiedad CSS display establece cómo se presenta un elemento
00:15
Reglas de orden de apilamiento de elementos CSS
00:24
CSS Flex Order: configurar el orden de los elementos del diseño flexible
00:10
CSS Align-Self: configurar la alineación individual de elementos
00:17
CSS Flex flex-shrink proporción de reducción de elementos de diseño flexible
00:34
Alineación de varias columnas de CSS Flex Align-Content en el eje transversal
00:29
CSS Flex Align-Content: Alineación de múltiples líneas en el eje transversal
00:27
CSS Flex Justify Content: Alineación del Eje Vertical
00:21
CSS justify-content define la alineación del eje principal del elemento
00:19
CSS Flex-Direction: dirección de alineación de elementos
00:19
CSS Flex align-items controla la alineación del eje principal de los elementos flexibles
00:19
CSS Flex: align-items configura la alineación de los elementos en el eje transversal
00:21
CSS Flex configura el ajuste de línea en diseños flexibles.
00:14
CSS Flex-Basis: espacio ocupado por el elemento en el eje principal de un diseño flexible
00:12
La propiedad flex-grow del diseño flexible define la relación de escala de los elementos
00:15
Diseño Responsivo CSS Responsive Layout
00:14
Diseño responsivo con CSS Flexbox
00:25
Conceptos básicos del diseño flexible de CSS Flex
00:16
Función de propiedad de cálculo dinámico CSS Calc()
00:20
CSS Position fixed fija un elemento a la ubicación especificada
00:15
Propiedad CSS border-radius para redondear las esquinas de los bordes de los elementos
00:14
Conceptos básicos del modelo de caja CSS
00:17
La propiedad CSS opacity especifica la opacidad de un elemento.
00:09
CSS text-shadow para añadir sombras al texto
00:18
La propiedad box-shadow de CSS se utiliza para agregar efectos de sombra en el marco de un elemento.
00:19
Efecto de rotación de elementos con CSS3 transform-rotate
00:17
Cómo centrar div horizontal y verticalmente rápidamente con CSS flex
00:12
CSS: Cómo usar la propiedad z-index para establecer el orden del eje Z de elementos posicionados y sus descendientes, o elementos flex
00:14
CSS Overflow, el contenido excede el tamaño especificado
00:39
Una vez para que recuerdes qué es el posicionamiento fijo CSS
00:15
Una vez para que entiendas la diferencia entre padding y margin
00:13
Diferencia entre CSS Display y Visibility
00:13
Diferencias entre posicionamiento fijo (fixed) y posicionamiento pegajoso (sticky) en CSS
00:20
CSS Gradient define efectos de degradado de color
00:48
CSS Margin: configuración de propiedades de margen externo del elemento
00:38
Propiedad CSS Float para configurar el efecto de envoltura de texto
00:17
CSS Transition define efectos de transición entre diferentes estados de un elemento
00:16
Propiedad CSS Max-Width: establece el ancho máximo de un elemento
00:10
CSS Flex Gap establece el espacio entre filas y columnas
00:17
Variables CSS: Definición y uso de variables
00:15
CSS line-height: Introducción a los principios básicos
00:13
Configuración de alineación vertical de elementos en línea CSS vertical-align
00:33
La palabra clave inicial de CSS restablece el valor inicial predeterminado del atributo
00:12
La palabra clave CSS Inherit fuerza a las propiedades a heredar los valores del elemento padre.
00:15
CSS: La palabra clave Unset para restablecer los valores de las propiedades
00:22
CSS currentColor representa el valor de la propiedad color del elemento actual
00:16
Colapso de Márgenes de Hermanos CSS (Margin Collapse)
00:14
CSS Plegado de margen de bordes exteriores de elementos padre e hijo (Margin Collapse)
00:19
Colapso de márgenes en elementos de bloque CSS vacíos
00:19
Bloque contenedor de elementos de posicionamiento estático
00:14
Bloque contenedor de CSS de elementos estáticos
00:22
El elemento Absolute contiene el bloque de contención (Containing Block)
00:12
Conceptos básicos del contexto de formato de bloque CSS (BFC)
00:16
CSS utiliza BFC para resolver el colapso de la altura del elemento padre
00:16
Resolver la fusión de márgenes externos entre elementos padre-hijo y hermanos a través de BFC
00:15
Introducción al modelo de color RGB
00:13
Introducción al modelo de color hexadecimal Hex del espacio de color RGB
00:20
Introducción al modelo de color HSL del espacio de color RGB
00:22
Introducción al modelo de color HWB en el espacio de color RGB
00:22
Conceptos básicos del diseño de cuadrícula CSS
00:13
grid-template-columns define el tamaño de las pistas de la cuadrícula
00:17
Diseño de cuadrícula grid-template-rows que define el tamaño de las pistas de fila
00:30
Propiedad grid-auto-flow en diseño de cuadrícula para gestionar la ubicación de elementos
00:41
Descripción general de Flexbox
00:14
8 métodos de centrado en CSS
00:11
8 métodos para centrar verticalmente en CSS
00:10
6 métodos para ocultar elementos en CSS
00:27
Análisis del principio de las unidades CSS
02:11
Conversión de unidades CSS
00:10
Descripción general de la cuadrícula CSS Grid
00:13
6 métodos para limpiar flotadores CSS
00:09
Estilos de texto CSS básicos
00:11
Estilos de decoración de texto CSS
00:08
Animación básica CSS keyframes
00:11
Transición de animación CSS.
00:15
Prioridad del selector CSS
00:09
Algoritmo de prioridad de selectores CSS
00:07
Selectores combinados CSS
00:11
Detalles del selector CSS
02:58

Principio de renderizado del navegador
智步DataV
16K 4

Conflictos y resolución de fusiones en Git
智步DataV
11,2K 1

Detalles de las ramas de Git
智步DataV
42,6K 32

Introducción detallada a XML
智步DataV
19,7K 6

Introducción detallada a YAML
智步DataV
21,6K 37

Demostración de la operación de reversión de Git
智步DataV
12,4K 3

Algoritmo de división y conquista de cobertura de tablero de ajedrez
智步DataV
1320 1

Comparación de tres operaciones de reversión de Git
智步DataV
18K 7

Introducción a NoSQL
智步DataV
8716 7

El arte del intercambio de datos JSON
智步DataV
29,1K 6

Introducción a las funciones de JavaScript
智步DataV
3334 0

Diferencias entre Git Merge y Rebase.
智步DataV
7812 0

Introducción a Nginx
智步DataV
6671 0

Análisis profundo de la etiqueta Git Tag
智步DataV
7515 7

Explicación detallada del comando Git cherry-pick
智步DataV
7169 2

Ámbito Global y Local de JavaScript
智步DataV
1461 0

Introducción a la configuración práctica de nginx
智步DataV
2202 1

¿Qué es exactamente la programación de IA?
智步DataV
552 0
谁是下一个鬼畜新星？
Servicio al cliente
Arriba
赛事库 课堂 2021拜年纪