黄翔-20201028

HTML 5.0：H5→标签（行级标签，块级标签）

CSS 3.0：层叠样式表→修饰问题
选择器（镜子）：精确选中要修饰的标签

<link rel="stylesheet" href="css/style.css" />在html中引用CSS

常用的选择器：1类选择器    
        格式：.className{
                属性：属性值；
                属性：属性值；
                  ……
                }

           2标签选择器          
        格式：选择器名称（标签名）{
                    属性：属性值；
                    属性：属性值；
                           }

           3 ID选择器：在选择器名称前面加#      （classname可以相同，id不可以）
        格式：#id名{
             属性：属性值；
             属性：属性值；
             ……
            }

           4后代选择器：在后代选择器中，空格代表后代
        格式：父标签 子标签{
                属性：属性值；
                属性：属性值；
                 }

           5伪类选择器：
            a:link{/*未访问状态*/
                color: red;
            }
            a:hover{/*鼠标悬停状态*/
                color: #008000;
            }
            a:active{/*激活选中状态*/
                color: black;
            }
            a:visited{/*访问过后状态*/
                color: #ADFF2F;
            }
        <a href="#">你点我啊</a>

           6通用选择器：
        格式：*{
              属性：属性值；
              属性：属性值；
            }

相同属性下：后代选择器（子选择器）> id选择器 > class选择器 > 标签选择器

文本样式
    color: pink;/*颜色*/
    font-size: 30px; /*字体大小*/
    font-family: "楷体";  /*字体*/
    font-style: italic; /*字体样式*/
    font-weight: bold; /*字体粗细*/
    letter-spacing: 5px;/*文字间距*/
    
    text-align: center; /*水平距离*/
    line-height: 250px; /*垂直距离*/
    text-decoration: none; /*文字线（下划上划删除）*/
    text-shadow: 2px 2px 2px greenyellow; /*文字阴影*/
    text-indent: 2em; /*首行缩进*/

背景样式
    background-color: red;  背景颜色
    background-image: url(img/favicon.ico); 背景图片
    background-repeat: no-repeat; 设置背景图片不重复
    background-size: 268px 272px;  设置背景图片大小
    background-size:cover;  设置背景图片充满盒子
    background-position: 150px 150px ; 背景图X,y轴方向位移

颜色表示方法
    color：#000000
    rgb(*,*,*)
    rgba(*,*,*,0-1)  最后一位透明度
    透明度：opacity: 0.3; /*0，完全透明；1,完全不透明*/
                 background-color: rgba(215,215,215,0.3);
        /*设置div透明，但是里面的内容不透明*/
                 background-color；transparent；/*背景全透明*/

心得体会：今天重点主要学习了CSS选择器，并学习了一些基础的设置，添加颜色等代码操作。用CSS选择器对html的块进行选择性的修饰，对文字或图片进行修改使其变得更美观。