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

 找回密码
 加入黑马

QQ登录

只需一步,快速开始

做梦呢

初级黑马

  • 黑马币:37

  • 帖子:12

  • 精华:0

© 做梦呢 初级黑马   /  2019-7-24 18:21  /  1335 人查看  /  0 人回复  /   0 人收藏 转载请遵从CC协议 禁止商业使用本文

经过半个多月的学习,从中我学会了很多有趣的知识点,比如过渡动画,一个网站LOGO如何优化。
过渡动画
1.transition: 要过渡的属性 花费时间 运动曲线 何时开始;
2.如果有多组属性,我们用逗号隔开
      transition: width 1s ease 0s, height 1s ease 0s, background-color 1s ease 0s;
3.all 所有属性都会变化(实际开发中不会分开书写多个属性,除非属性的运时间不同)
       transition: all 1s ease 0s;
4.    过渡写到本身上(谁需要过渡就加给谁)
       transition: all 0.5s;
常用的运动曲线:linear 匀速 ease逐渐慢下来
ease-in 加速  ease-out 减速    ease-in-out 先加速后减速
注意:我们一般将过渡属性加载盒子的本身上;
        过渡动画就是让摸一个动作是在一定的时间内完成;
logo的优化做法
01、一个div盒子class类名交logo,然后在里面嵌套一个h1,里面超链接a;
02、直接飞logo给固定的宽高,然后将h1里面a设置固定的大小和logo图片一样大;03、最后将背景图片给a,然后在a里面书写网站名称;
想要达到网站优化的效果超链接a里面的文字不需要显示,我们可以利用两种方法实现:
方法1: text-indent 移到盒子外面 (text-indent: -9999px) 然后overflow:hidden 淘宝的做法
方法2: 直接给font-size: 0; 就看不到文字了。



0 个回复

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