• This is the sixth day of my participation in the August More Text Challenge.

margin

  • The position properties of the component, divided into: inside margin and outside margin

1. From the outside

  • Represents the margin between the component and other external components

  • Case study:
  • If you just setmargin, it sets the top, bottom, left, and right, and it’s all set.
ohos:margin="10vp"
Copy the code
  • Set the first text componentohos:top_margin="10vp"

  • Set the following text box:ohos:top_margin="20vp"

Margin section:

  • Distance between the outer edge of a component and other components.
  • Is the distance to the parent layout if there are no other components outside the component.

2. The padding

  • The spacing between the inside of a component’s border and the text

  • It’s usually ok to set the top and left margins, because with those, you can determine the position of the text

  • The inside margin allows you to adjust the position of text inside a component
  • Set the inside margin of the second text to:ohos:top_padding="20vp"

Inside margin section:

  • The distance between the inside of the component border and the text inside.