南大软院大神养成计划——第四天

原创 2015年11月19日 20:54:31

时间飞逝了,转眼间就离南大软院大神养成计划实施有4天,这4天说长也不长,说短也不短,对于南大软院大神养成计划来说,算蛮长的了,比较已经过了1/7,对于大学生涯,这四天根本不算什么,但是假如我们珍惜每一天的时间去学习,那么大学四年下来,你学习到的东西绝对要比别人多的多。

今天由于要赶网页大作业,再加上课多,所以只能晚上学习和写博客了,这是我第四次写博客了,开始觉得没什么意思,但是写到后面渐渐地发现了其中的乐趣,当你看着点击量慢慢上升时,就会有一种自豪感,我写的文章终于有人看了,哈哈,闲话就说到这里。

今天学习的是“网页简单布局之结构与表现原则”,这个部分,讲师并没有教我们新的内容,教的是分析效果图的方法。制作一个商用网站,首先是由美工人员制作一张效果图,然后有前端人员通过分析效果图制作网页,是网页效果跟效果图上面的一样,而分析效果图也是需要方法的,所以现在公司招网页前端人员,只要会ps就会优先录取,果然技多不压身了。讲师将这部分内容时,主要讲的是结构与表现的分离,那什么是结构和表现呢?结构就是那些html的标签,比如div,p,table,这些都是结构,表现就是css样式了。讲师教我们分析效果图的方法是:先别过多的被样子打扰,先放在结构上,其实这也高手分析效果图的方法。想想现在的我,就是初学者的样子,看到一张效果图,先是分析css样子,然后再考虑结构,而高手和我是反的,我在听讲师讲课的过程中,我也不是特别明白,为什么要先分析结构呢?分析css样式不是更加方便吗,到后面才慢慢理解了,制作一个网页就像建房子,建房子肯定要先搭建好建构,然后装修,假如一个网站先考虑css样式,弱化结构,然后假如我们改动一点样式也许就会让网页的主体结构发生改变,这在我以前编写网页的时候,深有体会。我以前编写网页的时候,因为初学,当然现在也是初学者的样子,常常脑海里想到什么效果就写什么效果,然后就大量用css样式,结构并没有固定,导致有时候改动一点css样式就导致了网页效果的变形,这样我必须修改所有的css样式,增加了我的工作量,导致了我的效率低下。所以今天学习到了高效编写网页的方法。如何像高手一样分析效果图呢?就是先考虑设计图中的文字内容和其他模块之间的关系,重点放在编写html结构和语义化上,然后再考虑布局和表现样式。

由于觉得学习有点少了,所以有学习到一点知识了,就是css 雪碧图应用。什么是雪碧图呢?雪碧图就是很多张小图片拼在一起的图片,淘宝等大型网站都用这类雪碧图。这是我学习到的一个知识。比如一个网页要用很多个icon,假如我们用img标签一个一个去加载,这是要浪费很多时间的,假如能够直接将这些标签放在一起,然后加载一张雪碧图就将这些图标全部加载出来,这样网页可以减少很多负担,节约用户时间。那么肯定有人会觉得奇怪,icon全部放在一张图上,那我们怎么去调用呢?这就需要用到background-position了,这个熟悉有两个参数,分别对应x轴和y轴,通过设置这两个参数就可以设置,这就相当于我们在ps上用矩形选框,矩形选框可以任意移动,矩形选框里就是显示的内容。所以正是因为有了这个属性,我们才能用雪碧图。淘宝上的icon就是雪碧图加载出来的,所以我们浏览淘宝页面的时候常常可以看到一张图片里有很多小图片,那就是雪碧图。

今天的学习内容就是这么多了,虽然学习的内容不多,但是确实非常重要的内容,是我能否成为网页大神的基石之一,期待明天的学习。


南大软院大神养成计划--第四天JavaScript

今天开始学JavaScript (以下是归纳) JavaScript document.write() 输出内容(相当C语言里的printf) var 变量名 ...

南大软院大神养成计划--第四天单/复选框与文字对齐问题

大多数网站的主流文字大小为12px,因为在目前高分辨率显示器屏幕下,11px的汉字,其像素点开始不规整,文字不如12px来的显示良好。12px大小的文字就是主流也是底线。然而12px的文字与单选框和复...

【南大软院大神养成计划:第十天】久违了,JavaScript——入门篇(二)

今天把《JS入门篇》课程完成了,今早取快递路上思考人生时,粗略算了算,前端工程师课程总共700+节,21天学完需要每天完成37节,这样算当然不是很科学,但是也一定程度上体现了学习任务的并不轻松。  ...

南大软院大神养成计划——第一天

参加比赛的第一天 也是第一次写博客 心情是激动地 感觉不要不要的  但是依旧还是要开始的  那么就开始吧  干巴爹 第一天的战况 感觉自己的进度好慢 但是看看...
  • YaKIcoo
  • YaKIcoo
  • 2015年11月16日 23:03
  • 219

南大软院大神养成计划——第三天

第三天 终于结束了 慕课HTML+CSS部分的HTML基本语句~~~ 今天 看完HTML以后 我需要冷静一下 回顾一下 嗯,就这样。 表单中的各种按钮~~~ 1st. 提交按钮 ...
  • YaKIcoo
  • YaKIcoo
  • 2015年11月18日 23:48
  • 178

南大软院大神养成计划——第九天

今天是南大软院大神养成计划实施的第九天,今天学习的主要内容是DOM探索之基础详解篇的剩余两章内容,最后两章内容主要讲解的是“如何判断节点元素类型”和“继承层次和嵌套规则”。 先讲讲“如何判断节点元素...

南大软院大神养成计划——第十二天

今天是南大软院大神养成计划实施的第十二天,今天学习的内容是DOM事件探秘部分的最后部分——事件类型。事件类型从来大类来分可以分为鼠标事件和键盘事件。 先说说鼠标事件,鼠标事件可以分为click,ov...

南大软院大神养成计划——第十八天

今天是南大软院大神养成计划实施的第十八天。今天还是继续学习jQuery基础部分。 一.jQuery常用插件 表单验证插件——validate 该插件自带包含必填、数字、URL在内容的验证规则,即时显示...

南大软院大神养成计划——第十三天

今天是南大软院大神养成计划实施的第十三天,今天学习的主要内容是JS动画效果。 在浏览网页时候,我们经常会看到一些动画,有一些是flash动画,有一些则是用js编写的js动画,比如我们鼠标移动在某一个...

南大软院大神养成计划——第十四天

今天是南大软院大神养成计划实施的第十四天,离结束越来越近了,我也要加紧学习了。今天学习的主要内容是jS动画剩下的部分——链式运动和同时运动和一些动画案例。 链式运动: 什么是链式运动呢?链式运动就...
内容举报
返回顶部
收藏助手
不良信息举报
您举报文章:南大软院大神养成计划——第四天
举报原因:
原因补充:

(最多只允许输入30个字)