发表于: 2017-03-17 21:56:49

2 644


今天完成的事情(大约花了两个半钟时间

  1.学习了div、定位、chrome开发工具里较简单的工具、viewport简单概念和作用等相关知识;

  2.从不会用div、不会用百分百作值、不能自适应、没有圆角的九宫图到我认为符合任务要求的九宫图(>.<自己尝试好久最后完成了好开心);

  3.解决了昨天的疑问:

    5.怎样将若干个元素组合在同一个区域?让这些元素在固定的区域中进行浮动? 

         这个时候用到div啦!将内容放进div里,div作为父元素(不知道这个称呼对不对,对一些定义还没去看)也可以设置盒子模型各各个数据。

   

 明天计划的事情 

  1.尝试解决未解决的疑问:

   对相关概念与属性需再看看博客,尽力尝试自己耍出来,用不同方式比较总结结果;

  2.继续耍任务2;

  3.补知识:熟悉更多的属性和声明;


遇到的问题

  1.无法构建用百分比来定义的宽度与高度相等的div。

   解决方式:在博客上搜索,找到了一个方法:div.vw{width:100%;height:100vw;},我的理解是vw是div的单位......

  2.无法将div内的九个小正方形要相同且在div居中。(用百分比)

   解决方式:通过计算,这时候盒子模型各个项目的值很重要啊一定要考虑进去。

  3.我所做出的九宫图,div的宽度是运用屏幕的宽度,才能将九宫图放在网页正中央;如何将div的宽度小于网页的而放在正中央呢?

   尝试:将div大小缩小,用上text-align:center——失败!

   师兄解答:text-align只能用在父元素的子元素中,有浮动的元素无法使用。

   尝试:调整div的边距,使div居中。——成功~

  4.对text-align的概念不是很懂,要补补。

  5.我的文件里有很多个同名的标签名p,编码的时候有缩写的方法吗?

  6.viewport:不太懂比例概念。

  

收获

  1.运用百分比,百分比的基准是父元素的大小,可以实现自适应。

  2.今天运用了:border-radius;百分比;div;div.vw实现宽度与宽度一致;

  3.关于居中方法:

   ①调整盒子模型

   ②text-align:center(居中对象受限:浮动、绝对定位等)

  4.定位的相关概念:相对定位、绝对定位;还没运用;

  5.viewport:是网页适应移动端的屏幕;

   <meta name="viewport"content="width=device-width,initial-scale=1.0" >

  6.收获师兄一名>.<


日报用时:各种打岔花了快一两个钟- -...今天学习的时间花的比较少。







返回列表 返回列表
评论

    分享到