/* 设置背景色 */ body { background-color: #b3d9ff; } /* 给园设置圆角边框 */ #园 { border-radius: 50%; border: 5px solid #222; } /* 设定园的大小 */ #园 { width: 200px; height: 200px; } /* 调整园中心位置 */ #园 { position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); } /* 阴影效果 */ #园 { box-shadow: 0px 0px 10px 5px #333; } /* 一个简单的园 */
以上代码实现了将一个简单的园利用CSS进行美化,包含设置背景色、圆角边框、大小、位置和阴影效果,让园更显美观。在实际应用中,还可以通过更改背景图片、添加渐变色等方式实现更复杂的效果,让页面更加生动、华丽。