周玉莲-20201028

一、知识总结

1.选择器
HTML5.0:H5标签（块级标签：P、UL、DIV、行级标签：a.span.img.表单）
css3.0:层叠样式表  作用：修饰网页、
<link rel="stylesheet" href="css/stydle.css" />:将CSS代码引用 
选择器(镜子)：精确选中要修饰的目标
(1)常用的选择器：
0:通用选择器 （优先级最低）
 /*通用选择器*/
 *{
    margin:0;/*外边距*/
    padding: 0;/*内边距*/
    border: 0;/*边框*/
}
1.类选择器(class:类选择器的关键字)
/*类选择器*/
.box{       
    width: 300px;
    height: 200px;
    background-color: red;
}
2.标签选择器
/*标签选择器*/
h1{
   width:400px;
   height: 200;
   background-color:blueviolet;
}
3.id选择器
/*id选择器*/
#box{       
         width:400px;
         height: 200;
         background-color:  gold;
}
4.后代选择器
  /*后代选择器*/  
.box ul li{     ;空格
    color: red;
}
5.伪类选择器（鼠标悬停状态）
/*伪类选择器*/
a:hover{
    text-decoration: none;
}
hover:鼠标悬停状态
类选择器的优先级高于标签选择器
id选择器的优先级高于类选择器
2.修饰字体和文本的常用样式
.box{
    width: 400;
    height: 400;
    border: 1px #0000000 solid;
}
div{
    color: red;/*修饰字体的颜色*/ 
    font-size: 30px;/*修饰字体的大小*/ 
    font-family: 宋体;/*字体类型*/ 
    font-style: italic;/*字体的样式*/
    font-weight: bold;/*字体加粗*/
    letter-spacing: 5px; /*字体间距*/ 
    text-align: center(居中)left(左对齐)right(右对齐);/*对齐方式*/
    line-height: 300px;/*行高*/
    text-decoration: overline;/*文本的划线*/
    text-shadow: 2px (水平距离) 2px(垂直阴影距离) 3px(模糊距离) yellow;/*字体阴影*/
    text-indent: 2em;/*首行缩进*/
}
3.修饰背景的常用样式
div{
    background-color: red;/*背景颜色*/
    background-image: url(../img/icon.jpg);../:返回上级目录/*背景图片*/ 
    background-position:-100px 0;/*背景图片平移*/
    opacity:0.5;/*透明度*/
    background-size:300px 300px;/*背景图片的大小*/
    background-attachment:fixed;/*背景图片的固定*/
                          cover:覆盖;
    background-size:300px 300px;                     
    background-repeat;repeat-x;/*背景图片平铺*/
}
4.颜色的表示方法
color:#0000FF/rgb{0-moz-animation-delay:255.,0,0;} rgba{0,255,255,0-1(透明度);};
RGB与RGBA的区别与转换
RGB 是代表Red（红色） 、Green（绿色）、 Blue（蓝色）三个单词的缩写。
RGBA 颜色值是 RGB 颜色值的扩展，添加了一个 alpha 通道， 它规定了对象的不透明度。
Alpha透明度。取值0~1之间。(颜色的透明度)此色彩模式与RGB相同,RGB定义了颜色的红
绿蓝值,在RGB模式上新增了Alpha透明度.alpha通道一般用作不透明度参数。如果一个像素
的alpha通道数值为0%，那它就是完全透明的（也就是看不见的），而数值为100%则意味
着一个完全不透明的像素（传统的数字图像）。在0%和100%之间的值则使得像素可以透过
背景显示出来，就像透过玻璃（半透明性），这种效果是简单的二元透明性（透明或不透明）
做不到的。它使数码合成变得容易。alpha通道值可以用百分比、整数或者像RGB参数那样用
0到1的实数表示。
1、 基本语法:
R：红色值。 正整数（0~255）或 百分数（0.0% - 100.0%）
G：绿色值。 正整数（0~255）或 百分数（0.0% - 100.0%）
B：蓝色值。 正整数（0~255）或 百分数（0.0% - 100.0%）
A：透明度。取值0~1之间，不可为负值
RGBA 比元素设置 CSS 的透明度更好，因为单独的颜色可以在不影响整个元素的透明度，
他不会影响到元素其他的属性，比如说边框，字体同时也不会影响到其他元素的相关透明度。
使用 Opacity 来做透明，在父元素中使用了 Opacity，那么其它子元素都会受到影响。

background-color:transparent;/*背景全透明*/

二、心得体会
一天的学习时间又过去了，学习的东西也在慢慢从简单变复杂。比起昨天，今天我的学习效率
不是很高。从id选择器开始我输入的代码运行跟老师的运行不一样。今天老师稍微讲的有点快，
一直都是跟不上的状态。但认真的听讲记笔记，在课下多多练习应该没有什么问题。跟着老师
的节奏，相信两周结束会有不错的收获。人生也许不尽完美，正因为不完美，我们才要不断的
努力创造，努力奋斗，时间确实是生命，所以我们必须珍惜宝贵的生命。