A股上市公司传智教育(股票代码 003032)旗下技术交流社区北京昌平校区

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

© 陈健康 初级黑马   /  2019-10-12 15:24  /  1019 人查看  /  0 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文


谈到前端移动开发基础班的技术收获,那可谓是收获颇丰。首先,虽说我是在读的大四学生,在大学里所学习的是电商专业,专业课程里开设网页设计与制作的课程,那便是我第一次接触到网页代码,从此便对代码感到很大的兴趣,也下定决心学习这方面的知识,便在大三开始自学HTML和CSS。可想而知自学之路困难重重,首先没有老师讲解,同学交流,更是没有相应的工具和资源。来到黑马,这里不仅有老师。而且是非常好的老师。更有丰富齐全的资源。基础班10天的课程接近尾声,我就来谈谈有关技术方面的收获吧。
1.        HTML5 复习补充和新标签的知识
前三天的HTML5的学习里,不仅对我大学所学的知识进行系统详细的复习,更重要的是我还学习到很多以前没有接触到的标签和元素,不仅如此还学习到了很多新的知识。例如:以前只知道input标签的type值有text和password两种,但是通过新知识学习后我知道了下面这些:<input type="tel" placeholder="手机号码" >,<input type="email">,<input type="number" >,<input type="date">等等;这些只是冰山一角。
2.        CSS3的学习收获
CSS3的学习收获更是巨多。最让我印象深刻的是它使用的灵活性和丰富性,例如导航栏的滑动门做法灵活做法。当我学会CSS3做些动画时,我感到自己很厉害(哈哈),例如transform里的translate,rotate和rotate3d,scale和scale3d,skew;搭配transition效果更佳;使用CSS3做些简单的动画也是会用到这些,例如一个定义小球动画:@keyframes ball {
        0% {transform:  translate (0,0);}               
        100% {transform:  translate(400px);}
}
上面就是定义动画:小球由左向右移动到400px处。
@keyframes ball {
        0%{ left: 0; top:0; }
        25%{ left: 200px; top:0;}
        50%{ left: 200px; top:200px; }
        75%{ left: 0; top:200px; }
        100%{ left: 0; top:0; }
}
上面就是定义一个5帧的动画:小球在这一个矩形中移动:由左上角>右上角>右下角>左下角>左上角。

0 个回复

您需要登录后才可以回帖 登录 | 加入黑马