vue编写一个背景css样式代码生成器效果
代码语言:html
所属分类:背景
代码描述:vue编写一个背景css样式代码生成器效果
下面为部分代码预览,完整代码请点击下载或在bfwstudio webide中打开
<!DOCTYPE html> <html lang="en" > <head> <meta charset="UTF-8"> <link type="text/css" rel="stylesheet" href="//repo.bfw.wiki/bfwrepo/css/font-awesome-4.7.0/css/font-awesome.min.css"> <style> @import url("https://fonts.googleapis.com/css?family=Pontano+Sans|Covered+By+Your+Grace"); :root { --base: #363639; --base-light: #464649; --base-dark: #262629; --base-shade: #303033; --base-text: #7db69d; --label: #e9dfde; --label-text: #b18373; --accent: rgba(35,35,35,.7); --button: rgba(40,40,43,.7); } body { background-image: repeating-linear-gradient(var(--a), rgba(var(--bg-rgb), 0) 0, var(--line-y), var(--c2) calc(var(--y) - var(--l)), var(--c2) var(--y)), repeating-linear-gradient(var(--b), rgba(var(--bg-rgb), 0) 0, var(--line-x), var(--c1) calc(var(--x) - var(--l)), var(--c1) var(--x)); background-color: var(--bg); background-size: var(--size); } *, *::before, *::after { box-sizing: border-box; } body { margin: 0; height: 100vh; font-family: 'Pontano Sans', Helvetica, sans-serif; display: -webkit-box; display: flex; } main { -webkit-box-flex: 1; flex: 1; display: -webkit-box; display: flex; -webkit-box-pack: center; justify-content: center; -webkit-box-align: center; align-items: center; } button, select { border: none; border: 1px inset var(--button); padding: .7em 1em; border-radius: .35em; color: #fff; font: inherit; background: var(--button); cursor: pointer; outline: none; will-change: transform; -webkit-transition: -webkit-transform 200ms ease-out; transition: -webkit-transform 200ms ease-out; transition: transform 200ms ease-out; transition: transform 200ms ease-out, -webkit-transform 200ms ease-out; } button:active, select:active { -webkit-transform: scale(0.9); transform: scale(0.9); } button[disabled], select[disabled] { opacity: .7; cursor: not-allowed; } ::-webkit-input-placeholder { opacity: .4; font-family: 'Pontano Sans', Helvetica, sans-serif; font-size: .7em; color: var(--label-text); } ::-moz-placeholder { opacity: .4; font-family: 'Pontano Sans', Helvetica, sans-serif; font-size: .7em; color: var(--label-text); } :-ms-input-placeholder { opacity: .4; font-family: 'Pontano Sans', Helvetica, sans-serif; font-size: .7em; color: var(--label-text); } ::-ms-input-placeholder { opacity: .4; font-family: 'Pontano Sans', Helvetica, sans-serif; font-size: .7em; color: var(--label-text); } ::placeholder { opacity: .4; font-family: 'Pontano Sans', Helvetica, sans-serif; font-size: .7em; color: var(--label-text); } .menu select { -webkit-appearance: none; -moz-appearance: none; appearance: none; display: inline-block; padding: .4em; font-size: inherit; text-transform: uppercase; color: inherit; border: none; background: rgba(0, 0, 0, 0.1); border-radius: .2em; } .cue { width: 7em; height: 7em; padding: 1em; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; cursor: pointer; will-change: transform; -webkit-transition: -webkit-transform 200ms cubic-bezier(1, 0, 0.2, 1.25); transition: -webkit-transform 200ms cubic-bezier(1, 0, 0.2, 1.25); transition: transform 200ms cubic-bezier(1, 0, 0.2, 1.25); transition: transform 200ms cubic-bezier(1, 0, 0.2, 1.25), -webkit-transform 200ms cubic-bezier(1, 0, 0.2, 1.25); } .cue:active { -webkit-transform: scale(0.9); transform: scale(0.9); } .cue svg { fill: var(--c2-contrast); } label { display: block; padding: .3em; } textarea { font-size: 1.2em; font-family: monospace; padding: .5em; width: 100%; height: 100%; border: 1px solid #000; resize: none; -webkit-box-flex: 1; flex: 1; outline: none; background: var(--accent); color: rgba(255, 255, 255, 0.7); } .input-text { width: 100%; font-size: 2em; font-family: 'Covered By Your Grace', fantasy, serif; color: #5c69c2; border: 0; background: transparent; padding: 0em .5em; line-height: 1; outline: none; } .color-well { width: 2.75em; height: 2.75em; padding: 0; border-radius: 50%; overflow: hidden; border: 0.3em solid var(--base-shade); box-shadow: 0 0 0 1px #000 inset, 0 0.3em 1em rgba(0, 0, 0, 0.8) inset; cursor: pointer; -webkit-transform: translateZ(1em); transform: translateZ(1em); } .color-well.color-bg { background: var(--bg); } .color-well.color-a { background: var(--c2); } .color-well.color-b { background: var(--c1); } .color-well input[type=color] { opacity: 0; font-size: 0; } header { font-size: 1.3em; font-weight: 200; -webkit-box-flex: 1; flex: 1; } .controls { position: relative; -webkit-box-flex: 1; flex: 1; display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; border: 3px solid var(--base); border-color: var(--base-dark) var(--base-light) var(--base-light) var(--base-dark); box-shadow: 0 0 1.5em -.5em #000 inset; overflow: hidden; } .controls section { z-index: 1; } section { display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; } section > * { display: -webkit-box; display: flex; } .height-100 { height: 100%; } .row { display: -webkit-box; display: flex; } .flex-1 { -webkit-box-flex: 1; flex: 1; } .flex-2 { -webkit-box-flex: 2; flex: 2; } .column { display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; } .space-around { justify-content: space-around; } .center { -webkit-box-pack: center; justify-content: center; } .align-center { -webkit-box-align: center; align-items: center; } .switch { cursor: pointer; } .switch input { opacity: 0; position: absolute; } .switch input + * { display: inline-block; padding: .4em; color: inherit; background: rgba(0, 0, 0, 0.1); border-radius: .2em; } .switch input:checked + * { background: var(--accent); } .switch button { display: inline-block; text-transform: uppercase; padding: .4em; margin: .3em; color: inherit; background: rgba(0, 0, 0, 0.1); border-radius: .2em; border: none; white-space: nowrap; } .rad-slider { --degree: 0deg; --degree-reverse: calc(0deg - var(--degree)); position: relative; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; margin: 0em; border-radius: 50%; -webkit-transform: rotate(var(--degree)); transform: rotate(var(--degree)); } .rad-slider .label { -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; pointer-events: none; -webkit-transform: rotate(var(--degree-reverse)); transform: rotate(var(--degree-reverse)); } .rad-slider:hover { cursor: -webkit-grab; } .rad-slider.moving { cursor: -webkit-grabbing; } .rad-slider:not(.dirty) .label { opacity: 1; } .rad-slider .label { position: absolute; left: 50%; top: 5%; width: 6em; height: 6em; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; -webkit-transition: opacity 2000ms linear 2000ms; transition: opacity 2000ms linear 2000ms; opacity: .5; -webkit-transform: translate(-50%, -100%) rotate(var(--degree-reverse)); transform: translate(-50%, -100%) rotate(var(--degree-reverse)); } .rad-slider:hover .label { -webkit-transition-duration: 600ms; transition-duration: 600ms; -webkit-transition-delay: 0ms; transition-delay: 0ms; opacity: 1; } .rad-slider[name=a] { border-top-color: var(--c2); } .rad-slider[name=b] { border-top-color: var(--c1); } .spool { width: 12em; height: 12em; box-shadow: 0 0 0 .15em inset, 0 0 0 .15em, 0 0 0 4.5em #26292c; border: .9em double; border-top: .9em solid orange; } .color-wheel { width: 12em; height: 12em; border: .9em solid; box-shadow: 0 0 .3em -.15em #000, 0 0 .3em -.15em #000 inset; } .color-wheel span { pointer-events: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; position: absolute; text-align: center; top: 50%; left: 50%; width: 80%; -webkit-transform: translate(-50%, -50%) rotate(var(--degree-reverse)); transform: translate(-50%, -50%) rotate(var(--degree-reverse)); } .color-wheel::before { content: ''; position: absolute; top: .5em; left: 50%; -webkit-transform: translate(-50%, -1em); transform: translate(-50%, -1em); width: .65em; height: 2em; border-radius: 1em; background: currentColor; } .spool[name=a] { --handle-color: var(--c2); } .spool[name=b] { --handle-color: var(--c1); } .spool > div { width: 65%; pointer-events: none; } .spool span { pointer-events: none; -webkit-user-select: none; -moz-user-select: none; -ms-user-select: none; user-select: none; position: absolute; top: 35%; left: 65%; -webkit-transform: rotate(var(--degree-reverse)); transform: rotate(var(--degree-reverse)); } .spool input[type="range"] { -webkit-transform: rotate(-90deg); transform: rotate(-90deg); pointer-events: all; } input[type="range"] { -webkit-appearance: none; -moz-appearance: none; appearance: none; outline: none; padding: 0; border: 0; width: 100%; height: .5em; border-radius: 1em; cursor: pointer; box-shadow: 0 0 .3em -.15em #000; } input[type="range"]::-moz-range-track { -moz-appearance: none; appearance: none; background: #fff; outline: none; } input[type="range"]::-moz-focus-outer { border: 0; } input[type="range"]::-moz-range-thumb { -moz-appearance: none; appearance: none; width: 2em; height: 2em; border: none; box-shadow: 0 0 0.3em -0.15em #000, 0 0 0 0.5em var(--handle-color); border-radius: 1em; background: #fff; transform: scale(0.7); -moz-transition: .3s ease-out; transition: .3s ease-out; } input[type="range"]::-moz-range-thumb:focus, input[type="range"]::-moz-range-thumb:active { -moz-appearance: none; appearance: none; transform: scale(1.1); } input[type="range"]::-webkit-slider-thumb { -webkit-appearance: none; appearance: none; width: 2em; height: 2em; border: none; box-shadow: 0 0 0.3em -0.15em #000, 0 0 0 0.5em var(--handle-color); border-radius: 1em; background: #fff; -webkit-transform: scale(0.8); transform: scale(0.8); -webkit-transition: .3s ease-out; transition: .3s ease-out; } input[type="range"]::-webkit-slider-thumb:focus, input[type="range"]::-webkit-slider-thumb:active { -webkit-appearance: none; appearance: none; -webkit-transform: scale(1.1); transform: scale(1.1); } input[type="range"][disabled] { opacity: .3; cursor: not-allowed; } input[type="range"][disabled]::-moz-range-thumb { box-shadow: none; } input[type="range"][disabled]::-webkit-slider-thumb { box-shadow: none; } .params input[type=range] { background: var(--label-text); } .params input[type=range]::-moz-range-track { background: var(--label-text); } .params input[type=range]::-moz-range-thumb { background: var(--label-text); box-shadow: 0 0 0 0.25em var(--handle-color); } .params input[type=range]::-webkit-slider-thumb { background: var(--label-text); box-shadow: 0 0 0 0.25em var(--handle-color); } .palette input[type=range] { background: var(--contrast); } .palette input[type=range]::-moz-range-track { background: var(--contrast); } .palette input[type=range]::-moz-range-thumb { background: var(--contrast); box-shadow: 0 0 0 0.25em var(--handle-color); } .palette input[type=range]::-webkit-slider-thumb { background: var(--contrast); box-shadow: 0 0 0 0.25em var(--handle-color); } @-webkit-keyframes show-off { to { -webkit-transform: rotate3D(0.5, 0.5, 0.3, -360deg); transform: rotate3D(0.5, 0.5, 0.3, -360deg); } } @keyframes show-off { to { -webkit-transform: rotate3D(0.5, 0.5, 0.3, -360deg); transform: rotate3D(0.5, 0.5, 0.3, -360deg); } } .skin .modal__wrapper { background: none; font-size: 12px; -webkit-animation: show-off 900ms cubic-bezier(1, 0, 0.2, 1.25); animation: show-off 900ms cubic-bezier(1, 0, 0.2, 1.25); } .skin .modal__header { background: var(--base); color: var(--base-text); border-radius: 1em 1em 0 0; } .skin .modal__body { border-left: 3em solid var(--base); border-right: 3em solid var(--base); padding: 0; display: -webkit-box; display: flex; } .skin .modal__footer { background: var(--base); border-radius: 0 0 1em 1em; padding: 4.5em 2em 2em 2em; -webkit-perspective: 20em; perspective: 20em; } .skin .modal__footer::before, .skin .modal__footer::after { content: ''; position: absolute; width: 1em; height: 10em; bottom: 4em; background: var(--base-shade); } .skin .modal__footer::before { right: 100%; border-radius: 1em 0 0 1em; } .skin .modal__footer::after { left: 100%; border-radius: 0 1em 1em 0; } .skin .model { font-size: 2em; font-weight: 900; letter-spacing: -1px; text-transform: uppercase; padding-left: 1ch; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; } .skin .model small { font-size: 45%; letter-spacing: 0; line-height: 1; margin-left: 1ch; } .skin .params { --handle-color: var(--label); border: 1px inset #555; margin: .3em; padding: .2em; border-radius: .3em; text-transform: uppercase; font-size: .85em; } .skin .params > * { -webkit-box-flex: 1; flex: 1; display: -webkit-box; display: flex; background: var(--label); color: var(--label-text); border-radius: .2em; box-shadow: -1px -1px 0 0 rgba(0, 0, 0, 0.3) inset; } .skin .front .params > * { margin-left: .3em; -webkit-transform: rotate(0.35deg); transform: rotate(0.35deg); } .skin .front .case { -webkit-box-orient: horizontal; -webkit-box-direction: normal; flex-direction: row; } .skin .back .params > * { margin-right: .3em; -webkit-transform: rotate(-0.25deg); transform: rotate(-0.25deg); } .skin .back .case { -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; } .skin .back .now-playing { position: absolute; top: .5em; left: .5em; } .skin .back .input-text { padding-left: 4em; padding-right: 2.5em; } .palette { --handle-color: var(--color); position: absolute; top: 0; left: 0; width: 100%; height: 100%; background: var(--color); color: var(--contrast); -webkit-transform: translateY(100%); transform: translateY(100%); -webkit-transition: background 300ms linear, -webkit-transform 300ms ease-out; transition: background 300ms linear, -webkit-transform 300ms ease-out; transition: transform 300ms ease-out, background 300ms linear; transition: transform 300ms ease-out, background 300ms linear, -webkit-transform 300ms ease-out; display: -webkit-box; display: flex; -webkit-box-align: stretch; align-items: stretch; } .palette.open { -webkit-transform: translateY(0%); transform: translateY(0%); } .palette__x { cursor: pointer; font-size: 4em; line-height: 0; opacity: .4; position: absolute; top: 0.35em; right: 0.35em; } .palette__key { position: absolute; top: 2em; left: 2em; text-transform: uppercase; font-weight: bold; } .modal { position: fixed; top: 0; left: 0; width: 100vw; height: 100vh; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; } .modal__mask { background: rgba(252, 23, 112, 0.5); position: absolute; top: 0; left: 0; width: 100vw; height: 100vh; } .modal__wrapper { font-size: 1vmax; position: relative; width: 52em; height: 36em; background: rgba(0, 0, 0, 0.3) url() no-repeat 50% 50%; background-size: cover; color: #fff; display: -webkit-box; display: flex; border-radius: 1em; box-shadow: 0 2em 5em -1em #000; } .modal__container { -webkit-box-flex: 1; flex: 1; display: -webkit-box; display: flex; -webkit-box-orient: vertical; -webkit-box-direction: normal; flex-direction: column; } .modal__header { display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between; -webkit-box-align: center; align-items: center; padding: 1em 1.5em; } .modal__header * { margin: 0; } .modal__body { -webkit-box-flex: 1; flex: 1; overflow: auto; } .modal__footer { position: relative; } .modal__footer > * { -webkit-box-orient: horizontal; -webkit-box-direction: reverse; flex-direction: row-reverse; display: -webkit-box; display: flex; -webkit-box-pack: justify; justify-content: space-between; } .modal__x { cursor: pointer; font-size: 4em; line-height: 0; opacity: .4; position: absolute; top: 0.35em; right: 0.35em; } .front .modal__body { overflow: hidden; } .front .modal__body .controls { background: rgba(0, 0, 0, 0.5); } .front .modal__body .controls::before, .front .modal__body .controls::after { content: ''; position: absolute; top: 0; bottom: 0; z-index: 0; } .front .modal__body .controls::before { background: rgba(0, 0, 0, 0.2); width: 11em; left: 50%; -webkit-transform: translateX(-50%); transform: translateX(-50%); } .front .modal__body .controls::after { left: 0; right: 0; border-left: 5.5em solid rgba(0, 0, 0, 0.2); border-right: 5.5em solid rgba(0, 0, 0, 0.2); } .button-leave-active, .modal-enter-active { -webkit-transition: -webkit-transform 500ms cubic-bezier(1, 0, 0.2, 1.5); transition: -webkit-transform 500ms cubic-bezier(1, 0, 0.2, 1.5); transition: transform 500ms cubic-bezier(1, 0, 0.2, 1.5); transition: transform 500ms cubic-bezier(1, 0, 0.2, 1.5), -webkit-transform 500ms cubic-bezier(1, 0, 0.2, 1.5); } .modal-leave-active, .button-enter-active { -webkit-transition: -webkit-transform 500ms cubic-bezier(1, -0.5, 0.2, 1); transition: -webkit-transform 500ms cubic-bezier(1, -0.5, 0.2, 1); transition: transform 500ms cubic-bezier(1, -0.5, 0.2, 1); transition: transform 500ms cubic-bezier(1, -0.5, 0.2, 1), -webkit-transform 500ms cubic-bezier(1, -0.5, 0.2, 1); } .mask-enter-active, .mask-leave-active { -webkit-transition: opacity 300ms linear; transition: opacity 300ms linear; } .mask-enter, .mask-leave-to { opacity: 0; } .button-enter, .button-leave-to, .modal-enter, .modal-leave-to { -webkit-transform: scale(0); transform: scale(0); } .flip-container { -webkit-perspective: 85vmax; perspective: 85vmax; } .flip-container.flip-me .flipper { -webkit-transform: rotateY(-180deg); transform: rotateY(-180deg); } .flipper { -webkit-transition: 1000ms cubic-bezier(1, -0.2, 0.2, 1.2); transition: 1000ms cubic-bezier(1, -0.2, 0.2, 1.2); -webkit-transform-style: preserve-3d; transform-style: preserve-3d; position: relative; } .flipper .front, .flipper .back { -webkit-backface-visibility: hidden; backface-visibility: hidden; position: absolute; top: 0; left: 0; right: 0; bottom: 0; } .flipper .front { -webkit-transform: rotateY(0deg); transform: rotateY(0deg); } .flipper .back { -webkit-transform: rotateY(-180deg); transform: rotateY(-180deg); } .side { margin-top: -.7em; width: 1.3em; height: 1.3em; border: 1px inset #555; border-radius: .1em; display: -webkit-box; display: flex; -webkit-box-align: center; align-items: center; -webkit-box-pack: center; justify-content: center; font-size: 4em; font-weight: 900; color: var(--base-dark); opacity: .5; } .trap { position: absolute; z-index: -1; bottom: 0; border: 0.7em solid var(--base); border-color: var(--base-light) var(--base-dark) var(--base-dark) var(--base-light); border-bottom-width: 0; width: 65%; height: 8em; left: 50%; -webkit-transform-style: preserve-3d; transform-style: preserve-3d; -webkit-transform: translateX(-50%) rotateX(30deg); transform: translateX(-50%) rotateX(30deg); background-image: repeating-linear-gradient(135deg, rgba(54, 54, 57, 0) 0, #222 7px, #222 6px, #222 7px), repeating-linear-gradient(45deg, rgba(54, 54, 57, 0) 0, #666 7px, #666 6px, #666 7px); background-color: var(--base); background-size: 100%; } .track-list { position: absolute; top: 0; right: 0; color: #fff; cursor: pointer; border-radius: 0 0 0 .4em; overflow: hidden; } .track-list h4 { margin: 0; padding: 1ch; font-weight: 100; background: rgba(0, 0, 0, 0.4); } .track-list ul { margin: 0; padding: 0; box-shadow: 0 -1px 0 0 rgba(0, 0, 0, 0.1); background: rgba(0, 0, 0, 0.3); box-shadow: 0 0 1.5em -0.5em rgba(0, 0, 0, 0.2); } .track-list li { list-style: none; margin: 0; padding: 1ch; display: -webkit-box; display: flex; -webkit-box-align: baseline; align-items: baseline; white-space: nowrap; } .track-list li:hover { box-shadow: 0 0 2em 0 rgba(0, 0, 0, 0.2) inset; } .track-list li .fa { margin-right: 1ch; } [drawer] + * { max-height: 0; max-width: 0; overflow: hidden; -webkit-transition: 270ms ease-out; transition: 270ms ease-out; opacity: 0; } [drawer].open + * { opacity: 1; max-height: 500px; max-width: 500px; } </style> </head> <body> <main> <transition name="modal"> <div class="cue" @click="toggleModal()" v-show="!showModal"> <svg xmlns="http://www.w3.org/2000/svg" xmlns:xlink="http://www.w3.org/1999/xlink" version="1.1" x="0px" y="0px" width="403.98px" height="403.98px" viewBox="0 0 403.98 403.98" style="enable-background:new 0 0 403.98 403.98;" xml:space="preserve"> <path d="M334.131,220.651c-25.174,0-45.66,20.478-45.66,45.652s20.486,45.66,45.66,45.66c25.179,0,45.653-20.485,45.653-45.66 C379.792,241.129,359.31,220.651,334.131,220.651z M334.131,305.231c-21.463,0-38.928-17.456-38.928-38.912 c0-21.468,17.465-38.932,38.928-38.932c21.46,0,38.933,17.464,38.933,38.932C373.063,287.771,355.599,305.231,334.131,305.231z"></path> <path d="M67.75,311.973c25.183,0,45.657-20.479,45.657-45.653c0-25.179-20.474-45.66-45.657-45.66 c-25.176,0-45.659,20.481-45.659,45.66C22.091,291.479,42.573,311.973,67.75,311.973z M67.75,227.388 c21.466,0,38.928,17.456,38.928,38.916c0,21.468-17.462,38.928-38.928,38.928c-21.456,0-38.924-17.46-38.924-38.928 C28.825,244.844,46.286,227.388,67.75,227.388z"></path> <rect x="179.475" y="260.629" width="37.039" height="11.361"></rect> <path d="M233.557,258.514c4.188,0,7.574,3.397,7.574,7.582c0,4.18-3.387,7.573-7.574,7.573c-4.18,0-7.574-3.394-7.574-7.573 C225.982,261.911,229.377,258.514,233.557,258.514z"></path> <path d="M163.279,258.514c4.188,0,7.58,3.397,7.58,7.582c0,4.18-3.392,7.573-7.58,7.573c-4.182,0-7.574-3.394-7.574-7.573 C155.705,261.911,159.097,258.514,163.279,258.514z"></path> <path d="M67.75,252.205c7.789,0,14.102,6.309,14.102,14.099S75.538,280.41,67.75,280.41c-7.787,0-14.1-6.316-14.1-14.106 S59.963,252.205,67.75,252.205z"></path> <path d="M334.131,252.205c7.783,0,14.091,6.309,14.091,14.099s-6.308,14.106-14.091,14.106c-7.786,0-14.105-6.316-14.105-14.106 S326.345,252.205,334.131,252.205z"></path> <path d="M21.049,351.521c0,3.719,3.014,6.732,6.727,6.732h39.56c3.721,0,6.727-3.014,6.727-6.732v-7.213h258.8v7.213 c0,3.719,3.025,6.732,6.736,6.732h39.553c3.723,0,6.736-3.014,6.736-6.732v-7.213h18.094V181.515h-16.827v-39.982 c0-10.203-8.312-18.51-18.515-18.51h-19.925l33.808-61.626c4.139-0.223,7.445-3.619,7.445-7.819c0-4.332-3.519-7.851-7.858-7.851 s-7.858,3.519-7.858,7.851c0,2.008,0.789,3.821,2.016,5.214l-35.233,64.225H34.504c-10.213,0-18.51,8.301-18.51,18.51v39.98H0 V344.3h21.049V351.521z M237.765,297.658h-79.537v-4.585l9.161-4.252h61.215l9.161,4.252V297.658z M259.016,297.658h-14.519 v-8.877l-14.415-6.685h-64.188l-14.405,6.685v8.877h-14.521v-63.125h122.04v63.125H259.016z M383.795,226.959 c0,4.003-3.129,7.253-7.061,7.521c6.648,8.877,10.632,19.877,10.632,31.823c0,13.333-4.938,25.483-13.032,34.828 c0.336-0.052,0.677-0.116,1.029-0.116c4.185,0,7.591,3.406,7.591,7.574c0,4.188-3.406,7.582-7.591,7.582 c-4.172,0-7.573-3.395-7.573-7.582c0-0.381,0.06-0.766,0.128-1.15c-9.193,7.555-20.967,12.099-33.787,12.099 c-12.831,0-24.593-4.544-33.782-12.099c0.052,0.385,0.112,0.77,0.112,1.15c0,4.188-3.395,7.582-7.574,7.582 c-4.184,0-7.574-3.395-7.574-7.582c0-4.168,3.391-7.574,7.574-7.574c0.353,0,0.689,0.064,1.042,0.116 c-8.103-9.345-13.032-21.495-13.032-34.828c0-13.276,4.901-25.407,12.94-34.729c-0.036,0-0.076,0.008-0.104,0.008 c-4.188,0-7.582-3.39-7.582-7.573c0-4.188,3.395-7.574,7.582-7.574c4.176,0,7.574,3.386,7.574,7.574 c0,0.16-0.049,0.312-0.049,0.465c9.049-7.13,20.438-11.405,32.873-11.405c13.232,0,25.308,4.845,34.608,12.831 c0.513-3.679,3.646-6.531,7.466-6.531C380.401,219.385,383.795,222.775,383.795,226.959z M343.172,133.117h25.467 c4.646,0,8.416,3.779,8.416,8.416v39.56h-34.512v-1.475c0-3.605-3.014.........完整代码请登录后点击上方下载按钮下载查看
网友评论0