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

原创 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就是雪碧图加载出来的,所以我们浏览淘宝页面的时候常常可以看到一张图片里有很多小图片,那就是雪碧图。

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


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

和很多人不一样,我在此之前是并没有过接触过任何web设计的编程语言的。可能就是因为这样,当今天看见imooc上的代码时,会有点不太适应。是的,我没想到过,居然可以在浏览器里写程序,这确是打破了我之前的...
  • huangxin2015
  • huangxin2015
  • 2015-11-17 20:05:58
  • 101

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

学习心得   今天了解了一下 Sublime  Text 3 软件的部分使用方法,虽然Sublime  Text 2的稳定性更强,但是Sublime  Text 3 新增了不少功能,它启动非常的快,...
  • z15179324968
  • z15179324968
  • 2015-11-19 23:53:22
  • 85

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

今天深入学习了CSS的相关应用,CSS在基础应用下还具有继承、层叠等特殊性。                            还有盒模型的应用,margin-top、margin-right、...
  • jx370
  • jx370
  • 2015-11-19 17:58:51
  • 182

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

心得体会   第一次听web的课程,有点小激动,学到了一点小知识,也认识到了自己要学的东西还很多。   今天在慕课网上学习了web的前端开发,简单的了解了DW软件的基本使用方法,它可以编辑很多类型...
  • z15179324968
  • z15179324968
  • 2015-11-16 23:32:00
  • 131

南大软院大神养成第四天

html标签部分。 增加水平线 无序标签 无序标签 1有序标签 2有序标签 为表格添加标题和摘要 表格第一行第一列加粗显眼 第二行第一列...
  • valentine111
  • valentine111
  • 2015-11-28 18:54:20
  • 105

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

今天是大神养成计划第二天,看了慕课网的div+css页面布局,明白了一个网页都是有一个个的盒模型布局构成。所以我们做一个网页前,必须先对页面进行布局。我们可以把一个网页大致分为头部header,中间部...
  • u013175229
  • u013175229
  • 2015-11-17 21:33:41
  • 685

南大软院大神养成计划--day16

今天看到了在这些时刻可以装载Servlet : 1. Servlet 容器启动时自动装载Servlet 。实现这个只需要添加loadon-startup>1load-startup>在web.xm...
  • TimeSea
  • TimeSea
  • 2015-12-01 10:45:29
  • 239

南大软院大神养成计划NO.3

这是我参加昌大软院网页设计大赛培训的第三天,今天我将css与html进行了更深一步的了解。我相信,天道酬勤,努力总会有收获的,所以我会一如既往的努力,希望工作人员可以给与我肯定~!!我相信我一定会成功...
  • Mars_542167729
  • Mars_542167729
  • 2015-11-18 23:44:08
  • 276

南大软院大神养成计划--day01

首先感谢南昌大学软件学院可以给我们这个一个机会来自己自主独立完成一些大学生本应该多做的事情:多学习,多总结。开卷有益,但最难的还是持之以恒,作为一个Web前端的初学者,希望可以通过此次比赛增长自己的业...
  • TimeSea
  • TimeSea
  • 2015-11-16 22:16:06
  • 249

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

今天是南大软院大神养成计划实施的第二天,在这一天中,我学习了HTML+CSS基础教程,由于上过网页工程实训,所以对于这章内容,我更多是查漏补缺,看看自己哪里不会,然后补充知识,毕竟实训时间只有4天,讲...
  • qq_23418043
  • qq_23418043
  • 2015-11-17 12:42:47
  • 385
收藏助手
不良信息举报
您举报文章:南大软院大神养成计划——第四天
举报原因:
原因补充:

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