艺灵设计

全部文章
×

谈谈初学者应该如何学习div

作者:艺灵设计 - 来源:http://www.yilingsj.com - 发布时间:2013-11-16 18:52:51 - 阅: - 评:5 - 积分:0

“兴趣是最好的老师”这句真理性的话洒家就不进行扯蛋描述了。话说div属性有n多个,网上的初学教程也有n多个,在如此多的资源面前,初学者往往会迷失方向。这资源那资源的下载,三分热度,几天过后,一问三不知;一个月过后,资源还在那里放着,看看自己,还是什么都不会。我相信这是绝大多数亲的惯病,洒家做为一个过来人,对此也是深有体会。洒家自学习div至今有1年多的时间了,而真正与div天天见面的日子却少的可怜。好了,废话不多说了,还是来分享下洒家积累的一些经验,感觉对新手很有帮助的哦!

所谓“无规不成方圆”,div也是一样。这里就牵扯到最基础的两个属性width,height。世间万物皆占空间,正如div一样,有了宽与高,也就有了自己的一亩三分地。有了地之后需要把自己的地圈起来并设置栅栏,避免被别人抢占了过去,还可以挡一些走兽入侵。用什么圈呢,当然是用border圈了。圈完地后闲着没事时要给地里种庄稼,这时font应运而生。种庄稼也得讲究疏密度,太密了不行太疏了也不时,这时设置合理的line-height便恰到好处。由于洒家的地特别的多,各块地之间要进行内部的区分,如何区分开来呢,当然要用margin了。这回地也都区分开了,总感觉庄稼与栅栏挨的太近,走兽很容易就破坏了庄稼,于是伟大的padding成了保护神,拉长了外界与庄稼的距离。转眼间,洒家一亩三分地就剩下最后一块了,但洒家手中还有三种种子要种,这可如何是好呢?一分为三块当然是最好的选择,如果用display,这样每块之间都会留出一点空隙,收获时也好辨认各块地种的是什么庄稼。但是,洒家手中的种子还是比较多的,于是洒家选择了float,三块地紧密挨凑着,刚好把种子全部种完。这下万事大吉,洒家要回家睡觉去了,等着庄稼成熟后来丰收。

这天,洒家在看电视,“黄土地黑土地种地就用xxx”,冒了出来,此时洒家起起了自己家中的那块干巴巴的黄土地,尼马,这土地怎么能种出好庄稼呢!于是洒家买了些肥地用的化肥,就是那个background,这下土地颜色是彻底改变了,洒家心里乐呵呵的。

眼看着庄稼都已经开花了,各各都很嚣张的样子,正如同那句“春色满园关不注”,一个个的往栅栏外沖,都把洒家的栅栏给撑开了。这下可气坏了洒家,洒家一气之下拿了一把大剪刀----overflow我剪,我剪,我剪剪剪!我让你们不听话,洒家全给你们不听话的剪了。咔嚓咔嚓,节操碎一地。回头一看,发现丝瓜已经开花了,这货最不老实了,总想爬到人家脖子上那个啥。于是洒家使用position专门给这货修理了一番,具体操作便是搭起支架,让其顺着支架往上爬吧!

咳咳,洒家扯蛋完毕,来做下最后的总结。建议初学者应该率先掌握以下属性:width,height,border,background,font,line-height,margin,padding,display,float,position,overflow。如果初学者已经掌握了以上例举出来的10来个属性,建议您立即进行页面排版练习。首先干百度,页面最简洁,亲用一天时间搞定;接下来也不要什么普通的门户网站练手了,直接干新浪,页面屏数在12屏左右,预计亲2周内完毕。剩下的就全是经验性的东西了,亲在以后的练习中会慢慢积累,祝亲早日学会div,交流群:231749938

转载声明:
  若亲想转载本文到其它平台,请务必保留本文出处!
本文链接:http://www.yilingsj.com/div/2013-11-16/118.html

若亲不想直保留地址,含蓄保留也行。艺灵不想再看到有人拿我的技术文章到他的地盘或者是其它平台做教(装)程(B)而不留下我的痕迹。文章你可以随便转载,随便修改,但请尊重艺灵的劳动成果!谢谢理解。

亲,扫个码支持一下艺灵呗~
如果您觉得本文的内容对您有所帮助,您可以用支付宝打赏下艺灵哦!

Tag: div教程 经验分享 display overflow position

上一篇: 相对定位与绝对定位   下一篇: 兼容ie6的悬浮窗

评论区