(HTML5 & CSS3) Text decoration_rgb

Text decoration_rgb

css

body {
    background-color: #888888;
}

div {
    display: inline-block;
    width: 100px;
    height: 100px;
    border: 1px solid gray;
}

.red {
    background-color: rgb(255, 0, 0);
}
.green {
    background-color: rgb(0, 255, 0);
}
.blue {
    background-color: rgb(0, 0, 255);
}
.black {
    background-color: rgb(0, 0, 0);
}
.white {
    background-color: rgb(255, 255, 255);
}
.yellow {
    background-color: rgb(255, 255, 0);
}
.gray {
    background-color: rgb(126, 126, 126);
}


/*
16진수
0 1 2 3 4 5 6 7 8 9 a  b  c  d  e  f
10진수
0 1 2 3 4 5 6 7 8 9 10 11 12 13 14 15
*/
.hex-red {
    background-color: #FF0000;
}
.hex-green {
    background-color: #00FF00;
}
.hex-blue {
    background-color: #0000FF;
}
.hex-black {
    background-color: #000000;
}
.hex-white {
    background-color: #FFFFFF;
}
.hex-yellow {
    background-color: #FFFF00;
}
.hex-gray {
    background-color: #888888;
}


/* red green blue alpha */
.transparent-red {
    background-color: rgba(255, 0, 0, 0.5);
}
.transparent-green {
    background-color: rgba(0, 255, 0, 0.5);
}
.transparent-blue {
    background-color: rgba(0, 0, 255, 0.5);
}
.transparent-black {
    background-color: rgba(0, 0, 0, 0.5);
}
.transparent-white {
    background-color: rgba(255, 255, 255, 0.5);
}
.transparent-yellow {
    background-color: rgba(255, 255, 0, 0.5);
}
.transparent-gray {
    background-color: rgba(126, 126, 126, 0.5);
}


/* #red green blue alpha */
.hex-transparent-red {
    background-color: #FF000033;
}
.hex-transparent-green {
    background-color: #00FF0033;
}
.hex-transparent-blue {
    background-color: #0000FF33;
}
.hex-transparent-black {
    background-color: #00000033;
}
.hex-transparent-white {
    background-color: #FFFFFF33;
}
.hex-transparent-yellow {
    background-color: #FFFF0033;
}
.hex-transparent-gray {
    background-color: #88888833;
}