发表于: 2017-03-21 23:23:17
2 545
任务3看起容易,但其中还有许多需要注意的地方,折腾一晚都没搞出来,233333。CSS的入门很容易,但身为初学者一定要戒骄戒躁、不可浮躁自以为是,要学的东西还有很多,要深入的掌握细节,深入的理解机制。遇到没见过的用法就要动手去实践验证,不怕费时费力,但求能学到东西。
一、今天完成的事
1、下载PS,并为魔镜介绍页PSD进行切图
2、魔镜介绍页的结构编写
二、遇到的问题
1.如何将PS图层中的图片单独保存?如果是两个图层怎么办?
1)选中要切内容所在的图层,右键点击选择转换为智能对象。
2)右击选中编辑内容
3)点击文件>存储为web所用的png24格式(Alt+shift+Ctrl+s)
4) 如果是两个图层,可以按住ctrl同时选中两个图层转换
2.如何使带符号的圆位置不会随着屏幕的大小而改变?
为其添加fixed属性
.header{
position:fixed;
top:2%;
left:2%
}
3.如何使logo图片居中,使用不了text-align?
没有为其父层添加宽度
明天计划的事:
完成任务3并提交
学到的知识(收获)
1、text-align:center和margin:0 auto都能水平居中,区别在哪?
1.text-align:center 设置文本或img标签等一些内联对象(或与之类似的元素)的居中。
2.margin:0 auto 设置块元素(或与之类似的元素)的居中。
2、网页宽度如何自适应屏幕?
如果是想要一打开网页,则自动以原始比例显示,并且不允许用户修改的话,则是:
<meta name="viewport" content="width=device-width, initial-scale=1.0, minimum-scale=1.0, maximum-scale=1.0, user-scalable=no" />
这样子写后,就可以把一些页头横幅等的图片的宽度都设置成style="width:100%",整个页面在设备上看起来就是全屏的了。
评论