今日学习：
CSS颜色的学习，代码如下：
html
1 <!DOCTYPE html> 2 <html lang="en"> 3 <head> 4 <meta charset="utf-8"> 5 <meta name="viewport" content="width=device-width, initial-scale=1.0"> 6 <title>Colored Markers</title> 7 <link rel="stylesheet" href="styles-color.css"> 8 </head> 9 <body> 10 <h1>CSS Color Markers</h1> 11 <div class="container"> 12 <div class="marker red"> 13 <div class="cap"></div> 14 <div class="sleeve"></div> 15 </div> 16 <div class="marker green"> 17 <div class="cap"></div> 18 <div class="sleeve"></div> 19 </div> 20 <div class="marker blue"> 21 <div class="cap"></div> 22 <div class="sleeve"></div> 23 </div> 24 </div> 25 </body> 26 </html>
CSS
1 h1 {
2 text-align: center;
3 }
4
5 .container {
6 background-color: rgb(255, 255, 255);
7 padding: 10px 0;
8 }
9
10 .marker {
11 width: 200px;
12 height: 25px;
13 margin: 10px auto;
14 }
15
16 .cap {
17 width: 60px;
18 height: 25px;
19 }
20
21 .sleeve {
22 width: 110px;
23 height: 25px;
24 background-color: rgba(255, 255, 255, 0.5);
25 border-left: 10px double rgba(0, 0, 0, 0.75);
26 }
27
28 .cap, .sleeve {
29 display: inline-block;
30 }
31
32 .red {
33 background: linear-gradient(rgb(122, 74, 14), rgb(245, 62, 113), rgb(162, 27, 27));
34 box-shadow: 0 0 20px 0 rgba(83, 14, 14, 0.8);
35 }
36
37 .green {
38 background: linear-gradient(#55680D, #71F53E, #116C31);
39 box-shadow: 0 0 20px 0 #3B7E20CC;
40 }
41
42 .blue {
43 background: linear-gradient(hsl(186, 76%, 16%), hsl(223, 90%, 60%), hsl(240, 56%, 42%));
44 box-shadow: 0 0 20px 0 hsla(223, 59%, 31%, 0.8);
45 }
明日计划：
HTML注册表单和JAVA学习
遇到困难：web前端东西也多，好乱
标签：27,14,第一天,rgb,汇报,background,CSS,255 From： https://www.cnblogs.com/qmz-znv2/p/17576012.html