发表于: 2019-01-04 22:48:46

3 755


编辑日报内容...

今天完成的事情:修改了误操作提交的空日报,师兄您可以点评我上一篇日报了,谢谢~

哈哈,还有我不知道您在的qq群啊,可以的话评论一下~~~

任务四;

处理常见的移动端页面;

学会改变表单元素样式

absolute relative static fixed的区别;

了解移动端和PC端的区别及网页制作时的注意点;

明天计划的事情

任务五;

继续了解响应式和自适应布局;

继续了解如何绑定域名;

遇到的问题:

1、给body设置了宽高,再设置背景,背景仍然会铺满整个屏幕。

因为默认情况下,直接操作body的话,body会被浏览器当做根结点来对待,

子类(子类没有设置宽的前提下)会等于父类设置的宽,在没有设置任何html的背景色(或其他)属性时,body的高是都是无效的。

2、定位问题

absolute是相对于拥有定位属性的父元素进行定位移动,它会脱离文档流。如果父元素中的所有子元素都设置了absolute,那么所有的子元素都会浮起来。如果父元素没有相对定位,那么绝对定位就是相对于body进行定位的。

所以,为了不让元素跑飞,更好的定位,可给父元素设置relative吧。

收获:

1、 了解了文档流:将窗体自上而下分成一行一行,并在每行中按从左至右的挨次排放元素,即为文档流。

相对定位:元素框偏移某个距离。元素仍保持其未定位前的形状,它原本所占的空间仍保留。

绝对定位:即完全离开文档流, 相关于position属性非static值的比来父级元素进行偏移。

固定定位:即完全离开文档流,相关于视区进行偏移。

 

2、 了解了新的切图方法,直接点中图层,导出web存储。

3、 div外层的父标签如果没有定义高度或宽度(px或者其它单位定义,而非百分比)div用百分比是无效的。如果坚持要用百分比,请换成table标签。

4、 outline (轮廓)是绘制于元素周围的一条线,位于边框边缘的外围,可起到突出元素的作用。

通过设置outlinenone属性去除input边框样式。

可以按顺序设置如下属性:

outline-color规定边框的颜色。

outline-style规定边框的样式。

outline-width规定边框的宽度。

如果不设置其中的某个值,也不会出问题,比如 outline:solid #ff0000; 也是允许的。

5、垂直居中在某些情况下可以通过设置父元素的padding设置

lineheight属性也可设置居中。

6、可以使用百分比的样式属性

定位:top,right,bottom,left; 

盒模型:height,width,margin,padding, 

背景:background-position,background-size(css3), 

文本:text-indent,字体:font-size;

7、移动端和PC端网页制作时考虑的区别

第一:PC考虑的是浏览器的兼容性,而移动端开发考虑的更多的是手机兼容性,因为目前不管是android手机还是ios手机,一般浏览器使用的都是webkit内核,所以说做移动端开发,更多考虑的应该是手机分辨率的适配,和不同操作系统的略微差异化。

第二:在部分事件的处理上,移动端多出来的事件是触屏事件,而缺少的是hover事件。 另外包括移动端弹出的手机键盘的处理,这样的问题在PC端都是遇不到的。

第三:在移动端有很多网页是可以横屏看也可以竖屏看,并且很多屏幕的饿分辨率都是不一样的,所以只要牵涉到移动端都要考虑用响应式布局

第四:在动画处理上,PC端由于要考虑IE的兼容性,所以通常使用JS做动画的通用性会更好一些,但是CSS3做了很大的牺牲, 而在手机端,如果要做一些动画、特效等,第一选择是CSS3,既简单、效率又高。

第五:Pc端的交互是鼠标,键盘的交互而移动端变成了触摸,手势的交互


 

 



返回列表 返回列表
评论

    分享到