HTML and CSS learning day7

  • Rounded border
 border-radius: 15px;

To write a circular square border border-radius: 50%;or border-radius: half height or width;

Rounded Rectangle border-radius: 高度的一半;

Custom rounded corners
follow the clockwise order of upper left, upper right, lower right, and lower left
border-radius: 5px 10px 15px 40px;

Two values ​​represent the diagonal upper left-lower right upper right-lower left
border-radius: 20px 40px;

border-top-left-radius: 30px;
border-top-right-radius: ;
border-bottom-right-radius: ;
border-bottom-left-radius: ;

  • Box
    -shadow: 10px 10px 10px 10px rgba(0, 0, 0, 0.3); the
    horizontal position and the vertical position blur the size and color of the virtual and solid shadows.
    Box shadows do not take up space and will not affect the arrangement of other boxes

Guess you like

Origin blog.csdn.net/weixin_42778611/article/details/114831342