4-12 xhr协议介绍(及其相关ajax), css：@keyframs rule; http://coffeescrip网站

https://segmentfault.com/a/1190000004322487

介绍xhr(XMLHttpRequest协议)。底部有相关学习知识连接。

 w3cschool有基础。

---

Animation 

纯css实现动画效果，不需要flash或js. js有一个setInterval(function, 间隔时间)方法，也可以设置动画效果，不过用纯css效果也很好。

 https://www.w3schools.com/cssref/css3_pr_animation-keyframes.asp

 @keyframes rule specifies the animation code.

 The animation is created by gradually changing from one set of CSS style to another.

CSS Syntax

@keyframes animationname {keyframes-selector {css-styles;}}

Property Values

Value	Description
animationname	Required. Defines the name of the animation.
keyframes-selector	Required. Percentage of the animation duration. Legal values: 0-100% from (same as 0%) to (same as 100%) Note: You can have many keyframes-selectors in one animation.
css-styles	Required. One or more legal CSS style properties

常用的属性：可以写成一行／

    animation-name: example;
    animation-duration: 5s;
    animation-timing-function: linear;
    animation-delay: 2s;
    animation-iteration-count: infinite;
    animation-direction: alternate;

---

http://coffeescript.org/#top 应该先学javascript

 https://developer.mozilla.org/zh-CN/docs/Web/JavaScript

或者w3c 

getElementById 是JS function 

---

https://www.w3schools.com/css/css3_box-sizing.asp

CSS: box-sizing: border-box; 忽略padding，只计算width,height.

*{ box-sizing: border-box}  #=> 所有相关元素都忽略padding，这样大小就一样了。 

class=" .field"在出现错误的时候，变为field_with_errors .应该是rails的内置的功能。

Renamed the field error CSS class from fieldWithErrors to field_with_errors for consistency.