Practicaremos cómo agregar estilos en línea a un componente de React. Siga los pasos a continuación para completar el desafío:

1. Crear un nuevo componente de React llamado StyledBox.

2. Dentro del componente StyledBox, renderizar un elemento <div>.

3. Agregar los siguientes estilos en línea al elemento <div>:

   • Establecer el color de fondo en "lightblue";
   • Establecer el ancho en "300px";
   • Establecer el relleno en "10px";
   • Establecer el radio del borde en "10px";
   • Establecer la alineación del texto en "center";
   • Establecer el tamaño de fuente en "24px";
   • Establecer el peso de fuente en "bold".

4. Agregar contenido de texto dentro del elemento <div>, como Five Finger Death Punch.

1. Los estilos en línea se agregan utilizando el atributo style, y el valor de este atributo debe ser un objeto.
2. Al utilizar estilos en línea, los valores que no son números simples (como cadenas, unidades o colores) deben ir entre comillas "...". Por ejemplo, margin: "30px" indica que la propiedad margin tiene un valor de 30px.