资讯专栏INFORMATION COLUMN

关于Html+css阶段学习总结

Rindia / 1900人阅读

摘要:再之后,通过专业老师的指导,开始进行前端知识的全面及系统性的学习。而这篇文章便是对这次学习的一次阶段性总结。的学习并不是太难,也可以说是很容易,但千里之行,这才刚刚开始,熟练的掌握,还需要不断的练习。

一、学习经历

进入大学不久,就加入了社团,从而对前端有了一个初步的了解,之后也做过一些学校的官网,积累了一些微小的经验。
到了大二的时候,学校开设了专门的html+css课程,从中也学到许多新的html,css知识,也学到了如何规范的编写代码。但由于个人的懒散,两年半的时间大多是浑浑噩噩的度过,到头来并未学到太多有深度的知识。
再之后,通过专业老师的指导,开始进行前端知识的全面及系统性的学习。而这篇文章便是对这次学习的一次阶段性总结。

二、学习感受
细枝末节,一点一滴的积累  

听专业老师讲课,最明显的一点感受,就是他会提出一些特别的方法,用最简单的属性来实现你想要的效果。
例如 呼吸灯 案例。

在我看到这个案例时,第一想法当然是将 div 设置为 border-rudios:50% 的圆形容器,两个一嵌套,再通过animation 或 js 来控制动画就完事了。


    
HI

然而,老师却提了一个问题,如何控制宽高相等?————当然是设定固定宽高了! 老师又问,有没有别的比较简单的方法呢?————当然是有的啊!老师这样问,那当然是有的吧:)然而我那榆木脑袋却是想不出个什么方案出来。

子元素对于父元素有继承关系,其宽度默认填充父元素宽度,此时,诺是将父元素设为正方形,使子元素高度为100%,那么子元素是不是必然也是一个正方形?再通过父元素的 padding 属性来控制子元素的大小,这样岂不是很方便?当然,前提得将 div 设置为 边框盒子(box-sizing:border-box)。

    

原来 padding 还可以控制子元素的大小!在这之前,我仅用它进行定位而已。
后来,我又学到,在容器(边框盒子)宽度不固定时,如何使其成为一个正方形(在练习手机音乐播放界面时)。

width: 50%;
height: 0;
padding-bottom: 50%;

在父元素宽高不固定时,通过 padding-bottom 使得容器高度与宽度一致,从而制作成圆。

总结

如上所说的关于 padding 知识,都是对基本属性及知识点熟练掌握之后便可以较为容易想到的,可见那些基础知识点是多么的重要。
希望之后自己能多注重基础知识的积累,并将其融汇贯通。
html+css 的学习并不是太难,也可以说是很容易,但千里之行,这才刚刚开始,熟练的掌握 css,还需要不断的练习。

文章版权归作者所有,未经允许请勿转载,若此文章存在违规行为,您可以联系管理员删除。

转载请注明本文地址:https://www.ucloud.cn/yun/52127.html

相关文章

  • 关于Html+css阶段学习总结

    摘要:再之后,通过专业老师的指导,开始进行前端知识的全面及系统性的学习。而这篇文章便是对这次学习的一次阶段性总结。的学习并不是太难,也可以说是很容易,但千里之行,这才刚刚开始,熟练的掌握,还需要不断的练习。 一、学习经历 进入大学不久,就加入了社团,从而对前端有了一个初步的了解,之后也做过一些学校的官网,积累了一些微小的经验。 到了大二的时候,学校开设了专门的html+css课程,从中也学到...

    CoXie 评论0 收藏0
  • 坚持:学习Java后台的第一阶段,我学习了那些知识

    摘要:最近的计划是业余时间学习后台方面的知识,发现学习的过程中,要学的东西真多啊,让我一下子感觉很遥远。为了快速进入后台的开发,我也要加快脚步了 showImg(https://segmentfault.com/img/remote/1460000016070790?w=899&h=499); 最近的计划是业余时间学习Java后台方面的知识,发现学习的过程中,要学的东西真多啊,让我一下子感觉...

    instein 评论0 收藏0
  • 坚持:学习Java后台的第一阶段,我学习了那些知识

    摘要:最近的计划是业余时间学习后台方面的知识,发现学习的过程中,要学的东西真多啊,让我一下子感觉很遥远。为了快速进入后台的开发,我也要加快脚步了 showImg(https://segmentfault.com/img/remote/1460000016070790?w=899&h=499); 最近的计划是业余时间学习Java后台方面的知识,发现学习的过程中,要学的东西真多啊,让我一下子感觉...

    khs1994 评论0 收藏0
  • 坚持:学习Java后台的第一阶段,我学习了那些知识

    摘要:最近的计划是业余时间学习后台方面的知识,发现学习的过程中,要学的东西真多啊,让我一下子感觉很遥远。为了快速进入后台的开发,我也要加快脚步了 showImg(https://segmentfault.com/img/remote/1460000016070790?w=899&h=499); 最近的计划是业余时间学习Java后台方面的知识,发现学习的过程中,要学的东西真多啊,让我一下子感觉...

    April 评论0 收藏0

发表评论

0条评论

Rindia

|高级讲师

TA的文章

阅读更多
最新活动
阅读需要支付1元查看
<