H5+CSS3经验总结(上)

注:(这个时候我英雄联盟官网页面效果已经实现了四成,代码大概1800多行(无视频),希望为我的文章添加一丝丝的信服力) 

以下是自己目前实现的前部分:实现了自动轮播图,手动页面覆盖切换,多个二级导航栏,hover的各种效果等等等

    个人感觉,这个阶段相对于其他阶段是比较简单的,从语法,结构,用法以及思考的过程中,只要自己的基础知识够牢固,不把概念弄混,一切都只是时间问题,再不会,上度爹,上博客,上知乎,问学长,最长十几分钟解决,前提是知识牢固,所以我本人不建议只是不太牢固的情况下纯粹跟着视频做网页,最好看着视频,然后记下自己所遇到的问题,因为实践的过程中总会出现你怕什么,他就会来什么,所以不存在侥幸心理是学习的重要原则,以后的以后问题更多,知识越难,好好学习,好好复习,网页视频是告诉做网页的思路以及一些我们没有想到的网页做法,所以看视频还是比较好的,但是-----看视频看到最多四五成的时候,就该按着自己的思路来写了,如果纯跟视频,那如果让你纯手工重新写视频中的网页,你能写几天,我相信,和看视频快不到哪去,一个脑子里都是视频做法,自己没有实践经验的人如果遇到难题了,你猜会怎么做,会最大可能的回忆视频的做法,然后重新看视频,这就是视频依赖症.....所以一个网页自己看四成,写六成,个人感觉还是挺好的,知识也记住啦,做法也记住了,自己也通过实践了,问题也做笔记了,之后复习更有效率了....

    以上是看视频跟做的一些个人方法.

下面说一下写网页常常出现的问题:

1,定位问题

    这个问题出现最多,草率的来讲最常见的解决办法就是合理的使用position,display,float,margin,padding,还有一些方向词(top,right,left,bottom),自我感觉这是用的最多的,然后就是这些具体的用法,比如:在解决一个普通的二级导航栏的问题,父元素position:relative;需要隐藏的子元素position:absolute;然后再通过方向词或者margin,padding调整细节位置利用伪元素hover和transition调整隐藏和出现效果.

2.居中对齐问题

    一般的文字对齐都使用line-height的值等于行高,然后text-align居中就OK,多行的话可以单一的单行调整,然后调整margin和padding(最好加上box-sizing,这样不会影响盒子大小).用多了自然了解了就

3.优先级,名字,选择器问题

    选择器问题,后代选择器和子代关系选择器他们之间的优先级问题容易在css外包中弄混淆,简单粗暴的办法就是直接改z-index,掌握他们使用的原理,一般就是在css中使用的后代选择器越多,优先级越大,名字要规范,尽量一眼就能看出来他是干什么的,要不然做到后面会很麻烦.

    最想说的是.定位问题是最重要的,他能解决极大部分布局问题,细节部分查找css知识,按时复习即可.

©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容

  • 学习静态页面设计的这几个礼拜,从懵懂到熟知、熟用、熟解,可以说总结了一些小经验吧,在设计时会方便、快捷地写代码,而...
    A卡卡米阅读 486评论 1 1
  • 一、HTML5 1.1 认识HTML5 HTML5并不仅仅只是作为HTML标记语言的一个最新版本,更重要的是它制定...
    福尔摩鸡阅读 16,066评论 14 51
  • 推荐指数: 6.0 书籍主旨关键词:特权、焦点、注意力、语言联想、情景联想 观点: 1.统计学现在叫数据分析,社会...
    Jenaral阅读 5,742评论 0 5
  • 昨天,在回家的路上,坐在车里悠哉悠哉地看着三毛的《撒哈拉沙漠的故事》,我被里面的内容深深吸引住了,尽管上学时...
    夜阑晓语阅读 3,810评论 2 9
  • 一。匹配。 判断一个字符串是否符合我们制定的规则? 二…捕获 字符串中符合我们正则表达式,规则的,内容捕获到。 三...
    时修七年阅读 1,002评论 2 0