body, html, div, p, ul, li, h1, h5, textarea { margin: 0; padding: 0; } body { font-size: 14px; } p { line-height: 25px; } a { text-decoration: none; } h1 { width: 100%; height: 100px; text-align: center; line-height: 100px; background: #F9F9F9; } .main { width: 950px; min-height: 1000px; margin: 0 auto; margin-top: 10px; } .gray { color: #999999; font-size: 12px; } .fl { float: left; } .fr { float: right; } .make { width: 460px; background: #F9F9F9; padding: 10px; } .config { width: 440px; background: #F9F9F9; padding: 10px; } textarea { width: 450px; height: 250px; border-radius: 5px; resize: none; font-size: 14px; padding: 3px; } .pzcl, .pzsz, .pzlo { cursor: pointer; } .config .rotate { transform: rotate(90deg); } .config span { display: inline-block; } input[type='color'] { height: 16px; } input[type='range'] { height: 16px; line-height: 16px; } .pzcln, .pzszn, .pzlon { background: #fff; padding: 5px; } /*去除默认样式*/ input[type=range] { -webkit-appearance: none; border-radius: 2px; /*这个属性设置使填充进度条时的图形为圆角*/ } input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; } /*给滑动轨道(track)添加样式*/ input[type=range]::-webkit-slider-runnable-track { height: 4px; border-radius: 2px; /*将轨道设为圆角的*/ background: #afc9db; } input[type=range]::-moz-range-progress { height: 4px; border-radius: 2px; /*将轨道设为圆角的*/ background: #afc9db; } /*原始的控件获取到焦点时,会显示包裹整个控件的边框,所以还需要把边框取消。*/ input[type=range]:focus { outline: none; } /*给滑块(thumb)添加样式*/ input[type=range]::-webkit-slider-thumb { -webkit-appearance: none; height: 14px; width: 14px; margin-top: -5px; /*使滑块超出轨道部分的偏移量相等*/ background: #afc9db; border-radius: 50%; /*外观设置为圆形*/ box-shadow: 0 0 8px #ddd; /*添加底部阴影*/ } .logo { width: 100px; height: 100px; border: 1px solid #999999; margin: 0 auto; } .logo img { width: 100%; height: 100%; } button, .download { line-height: 30px; height: 30px; width: 100px; background: #AFC9DB; box-shadow: none; border: none; border-radius: 2px; cursor: pointer; text-align: center; } #qrcode { height: 250px; width: 100%; text-align: center; background: #fff; } #qrcode img { height: 250px; }