#poster {width:322px;height:570px;border:1px solid #ccc;position:relative} #poster .bg{ position:absolute;width:100%;z-index:0} #poster .drag[type=img] img,#poster .drag[type=thumb] img,#poster .drag[type=shopThumb] img { width:100%;height:100%; } #poster .drag {position: absolute; width:80px;height:80px;} #poster .drag:before {content: '';border: 1px dashed #000;position: absolute;top: 0;left: 0;right: 0;bottom: 0;z-index: 1;} #poster .drag.selected:before{border: 2px dashed #00aeff;} #poster .drag[type=nickname],#poster .drag[type=time] { width:120px;height:40px; font-size:16px; font-family: 黑体;} #poster .drag img {position:absolute;z-index:0;width:100%; } #poster .drag.circle img {border-radius: 100%;} #poster .drag.radius img {border-radius: 10px;} #poster .rRightDown,.rLeftDown,.rLeftUp,.rRightUp,.rRight,.rLeft,.rUp,.rDown{position:absolute;width:7px;height:7px;z-index:1;font-size:0;} #poster .rRightDown,.rLeftDown,.rLeftUp,.rRightUp,.rRight,.rLeft,.rUp,.rDown{background:#ff4a5d;display: none;border-radius: 100%;} #poster .selected .rRightDown,.selected .rLeftDown,.selected .rLeftUp,.selected .rRightUp,.selected .rRight,.selected .rLeft,.selected .rUp,.selected .rDown{display: block;} .rLeftDown,.rRightUp{cursor:ne-resize;} .rRightDown,.rLeftUp{cursor:nw-resize;} .rRight,.rLeft{cursor:e-resize;} .rUp,.rDown{cursor:n-resize;} .rLeftDown{left:-2px;bottom:-2px;} .rRightUp{right:-2px;top:-2px;} .rRightDown{right:-2px;bottom:-2px;} .rRightDown{background-color:#00F;} .rLeftUp{left:-2px;top:-2px;} .rRight{right:-2px;top:50%;margin-top:-2px;} .rLeft{left:-2px;top:50%;margin-top:-2px;} .rUp{top:-2px;left:50%;margin-left:-2px;} .rDown{bottom:-2px;left:50%;margin-left:-2px;} .context-menu-layer { z-index:9999;} .context-menu-list { z-index:9999;} .temp-list{height: auto;width: 100%;overflow: hidden;moz-user-select: -moz-none;-moz-user-select: none;-o-user-select:none;-khtml-user-select:none;-webkit-user-select:none;-ms-user-select:none;user-select:none;} .temp-list .item{height: 60px;width: 60px;border: 1px solid #eee;padding: 3px;float: left;margin: 0 8px 8px 0;cursor: pointer;position: relative;} .temp-list .item.selected:before{content: '';position: absolute;top: 3px;right: 3px;bottom: 3px;left: 3px;background: rgba(0, 0, 0, 0.5);z-index: 1;} .temp-list .item.selected:after{position: absolute;z-index: 2;top: 0;left: 0;right: 0;bottom: 0;content: "\e601";font-family: "iconfont" !important;font-style: normal;-webkit-font-smoothing: antialiased;-moz-osx-font-smoothing: grayscale;color: #fff;font-size: 28px;text-align: center;line-height: 60px;} .temp-list.temp-selected .item.selected:before{border: 2px solid #1ab394;background: none;top: -1px;left: -1px;right: -1px;bottom: -1px;} .temp-list.temp-selected .item.selected:after{display: none;} .temp-list .item.add:before{content: '';position: absolute;height: 4px;width: 36px;background: #eee;top: 50%;left: 50%;margin-top: -2px;margin-left: -18px;} .temp-list .item.add:after{content: '';position: absolute;height: 36px;width: 4px;background: #eee;top: 50%;left: 50%;margin-top: -18px;margin-left: -2px;} .temp-list .item img{height: 52px;width: 52px;} .temp-list .item .icon-close{position: absolute;top: 0;right: 0;background: #000;color: #fff;height: 16px;width: 16px;line-height: 18px;text-align: center;font-size: 14px;display: none;} .temp-list .item:hover .icon-close{display: block;} .temp-list ~ .help-block{margin-bottom: 8px;} .underline{border-bottom: 1px solid #666;} .image-nail{height: 100px;} .image-nail img, .image-bg img{width: 92px;position: relative;z-index: 1;display: none;} .image-nail img{height: 92px;} .image-bg{height: 178px;} .image-bg img{height: 170px;} .image-nail, .image-bg{width: 100px;border: 1px solid #eee;padding: 3px;position: relative;cursor: pointer;} .image-nail:before, .image-bg:before{content: '';position: absolute;height: 4px;width: 36px;background: #eee;top: 50%;left: 50%;margin-top: -2px;margin-left: -18px;} .image-nail:after, .image-bg:after{content: '';position: absolute;height: 36px;width: 4px;background: #eee;top: 50%;left: 50%;margin-top: -18px;margin-left: -2px;} .image-nail .text, .image-bg .text{position: absolute;left: 3px;right: 3px;bottom: 3px;height: 24px;background: rgba(0, 0, 0, 0.7);color: #fff;line-height: 24px;text-align: center;z-index: 2;display: none;} .image-nail.selected .text, .image-bg.selected .text{display: block;} .image-nail.selected img, .image-bg.selected .text{display: block;}