.backliving { position: fixed; top: 8rem; left: 0; background: #ee5a5a; height: 1.4rem; line-height: 1.4rem; width: 3.8rem; padding-left: 0.3rem; border-radius: 0 1rem 1rem 0; color: #fff; font-size: 0.6rem; z-index: 999; } .isliving { height: 1.2rem; width: 3.75rem; position: absolute; z-index: 10; right: 0; bottom: 0; color: #fff; line-height: 1.25rem; font-size: 0.6rem; text-align: right; padding: 0 0.5rem; background: -moz-linear-gradient(left top, #ffce4a 0%, #fe9402 100%); background: -webkit-linear-gradient(left top, #ffce4a 0%,#fe9402 100%); background: -o-linear-gradient(left top, #ffce4a 0%,#fe9402 100%); background: -ms-linear-gradient(left top, #ffce4a 0%,#fe9402 100%); background: linear-gradient(to right bottom, #ffce4a 0%,#fe9402 100%); filter: progid:DXImageTransform.Microsoft.gradient(startColorstr=#ffffce4a, endColorstr=#fffe9402,gradientType=1) ; } .isliving:before { content: ''; position: absolute; top: 0.3rem; left: 0.5rem; height: 0.6rem; width: 0.6rem; background: url("../images/note.gif") no-repeat; background-size: 100%; } .isliving2 { height: 3.2rem; width: 3.55rem; position: absolute; background-image: url("../images/living.png"); background-position: center; background-repeat: no-repeat; background-size: 100%; z-index: 10; right: 0.5rem; bottom: 0.5rem; }