bootstrap入门

前段框架：bootstrap官网http://www.bootcss.com/bootstrap导航改颜色的属性

length：实际像素值设置背景图像的高度和宽度。第一个值设置宽度，第二个值设置高度。如果只设置一个值，则第二个值会被设置为 "auto"。

percentage：以父元素的百分比来设置背景图像的宽度和高度。

cover：把背景图像扩展至足够大，以使背景图像完全覆盖背景区域

contain：把图像图像扩展至最大尺寸，以使其宽度和高度完全适应内容区域

h-shadow：水平阴影的位置。允许负值。

v-shadow：垂直阴影的位置。允许负值。

blur：可选。模糊距离。

spread：可选。阴影的尺寸。

color：可选。阴影的颜色。

inset：可选。将外部阴影 (outset) 改为内部阴影。

text-shadow：向文本添加阴影

word-wrap：允许对长的不可分割的单词进行分割并换行到下一行

text-overflow：规定当文本溢出包含元素时发生的事情

• 重要方法：
  •  translate()：移动
  • rotate()：旋转
  • scale()：放大/缩小
  • skew()：变形/拉伸·放大/缩小  通过2D转换，宽高都为原来的2倍-ms-transform:scale(2,2); /* IE 9 */
  • -webkit-transform: scale(2,2);
  • transform: scale(2,2);/*标准用法*/

div {   

transition-property: width; 

transition-duration: 3s;  

transition-timing-function: linear;   

 transition-delay: 2s; 

}

animation-name：规定 @keyframes 动画的名称。

animation-duration：规定动画完成一个周期所花费的秒或毫秒。默认是 0。

animation-timing-function：规定动画的速度曲线。默认是 "ease"。

animation-delay：规定动画何时开始。默认是 0。

animation-iteration-count：规定动画被播放的次数。默认是 1。

animation-direction：规定动画是否在下一周期逆向地播放。默认是 "normal"。alernate值表示动画应该轮流反向播放

CSS3 动画· 

关键帧（keyframes）@keyframes mymove { 0% {top: 0px;}25% {top:

• CSS3 动画· 
  • 关键帧（keyframes）
  • @keyframes mymove {    0% {top: 0px;}25% {top: 200px;}75% {top: 50px}100% {top: 100px;}}
  • columns规定设置 
  • column-width 和
  •  column-count 的简写属性
  • column-count规定元素应该被分隔的列数
  • column-width规定列的宽度
  • column-gap规定列之间的间隔
  • column-rulecolumn-rule 属性设置列之间的宽度、样式和颜色规则