div+css布局实现城堡建筑效果代码
代码语言:html
所属分类:布局界面
代码描述:div+css布局实现城堡建筑效果代码
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <style> body { background-color: #fff7f3; } #building { width: 200px; height: 350px; position: absolute; top: 50%; left: 50%; transform: translate(-50%, -50%); background: conic-gradient( from 135deg at 50% 50%, #423b4d 0 90deg, transparent 0 100% ) 118px 146px / 18px 18px, linear-gradient(#423b4d, #423b4d) 118px 164px / 18px 20px, conic-gradient(from 135deg at 50% 50%, #423b4d 0 90deg, transparent 0 100%) 91px 146px / 18px 18px, linear-gradient(#423b4d, #423b4d) 91px 164px / 18px 20px, conic-gradient(from 135deg at 50% 50%, #423b4d 0 90deg, transparent 0 100%) 64px 146px / 18px 18px, linear-gradient(#423b4d, #423b4d) 64px 164px / 18px 20px, conic-gradient(from 135deg at 50% 50%, #423b4d 0 90deg, transparent 0 100%) 164px 212px / 18px 18px, linear-gradient(#423b4d, #423b4d) 164px 230px / 18px 26px, conic-gradient(from 135deg at 50% 50%, #423b4d 0 90deg, transparent 0 100%) 18px 212px / 18px 18px, linear-gradient(#423b4d, #423b4d) 18px 230px / 18px 26px, conic-gradient(from 135deg at 50% 50%, #423b4d 0 90deg, transparent 0 100%) 118px 306px / 18px 18px, linear-gradient(#423b4d, #423b4d) 118px bottom / 18px 26px, conic-gradient(from 135deg at 50% 50%, #423b4d 0 90deg, transparent 0 100%) 91px 306px / 18px 18px, linear-gradient(#423b4d, #423b4d) 91px bottom / 18px 26px, conic-gradient(from 135deg at 50% 50%, #423b4d 0 90deg, transparent 0 100%) 64px 306px / 18px 18px, linear-gradient(#423b4d, #423b4d) 64px bottom / 18px 26px, linear-gradient(#a74c46, #a74c46) 40px 138px / 120px 8px, radial-gradient(#423b4d 9px, transparent 10px) 90px 233px / 20px 20px, linear-gradient(#423b4d, #423b4d) 163px bottom / 20px 40px, linear-gradient(#423b4d, #423b4d) 17px bottom / 20px 40px, linear-gradient(#c3bec4, #c3bec4) 154px 284px / 38px 6px, linear-gradient(#c3bec4, #c3bec4) 8px 284px / 38px 6px, conic-gradient(from 160deg at 50% 0%, #d76d55 0 40deg, transparent 0 100%) 150px 130px / 46px 60px, conic-gradient(from 160deg at 50% 0%, #d76d55 0 40deg, transparent 0 100%) 4px 130px / 46px 60px, linear-gradient(#a74c46, #a74c46) 146px 190px / 54px 8px, linear-gradient(#a74c46, #a74c46) 0 190p.........完整代码请登录后点击上方下载按钮下载查看
网友评论0