How to Use CSS to beautify the three-dimensional effect when the border of a table is concave

Of course, only one idea is provided here, and you can flexibly modify and use it.

<Meta http-equiv = "Content-Type" content = "text/html; charset = gb2312 "> <center> </P> <fieldset id =" Shop "style =" width: 200; "> <legend> <span style =" font size: 12px "> feet home </span> </legend> <p> <span style =" font size: 12px "> the border is the default style </span> </P> </fieldset> <fieldset id =" Shop "style =" width: 200; Border: inset; border-top-width: 3px; border-right-width: 3px; border-bottom-width: 3px; border-left-width: 3px; "> <legend> <span style =" font size: 12px "> foot home </span> </legend> <p> <span style =" font size: 12px "> This border is concave </span> </P> </fieldset> <p> </center>