body {
    margin: 0px;
    overflow: hidden;
    /*禁用滚动条*/
}

* {
    margin: 0;
    padding: 0;
}

ul,
ol {
    list-style: none;
}

#xxx {
    display: block;
    background: white;
    position: fixed;
    top: 0;
    left: 0;
}

button {
    position: fixed;
    bottom: 0;
    left: 0;
}

.icon {
    width: 1em;
    height: 1em;
    vertical-align: -0.15em;
    fill: currentColor;
    overflow: hidden;
}

.actions {
    position: fixed;
    top: 0;
    left: 0;
    padding: 20px;
}

.actions svg {
    width: 2em;
    height: 2em;
    margin-left: 25px;
    cursor: pointer;
}

.actions svg:active {
    color: red;
}

.actions svvg.active {
    fill: red;
    transform: scale(1.2);
    transition: all 0.6s;
}

.active {
    fill: red;
    transform: scale(1.2);
    transition: all 0.6s;
}

.colors {
    position: fixed;
    top: 50px;
    left: 30px;
}

.colors>li {
    width: 20px;
    height: 20px;
    margin: 10px 0;
    border-radius: 20px;
    box-shadow: 1px 1px grey;
}

.colors>.red {
    background-color: red;
}

.colors>.green {
    background-color: green;
}

.colors>.blue {
    background-color: blue;
}

.colors>.black {
    background-color: black;
}

.xxx {
    background-color: white;
}