发表于： 2018-09-17 14:02:32
4 665
在这之前通过我哥的推荐开始学习前端,采用的方式是看网上的一些教学视频,一边看视频内容,一边自己学习打代码.经过一段时间的学习,发现有个现象就是学习了后面的内容又会把前面的内容忘记,只能又把前面的知识拿出来复习.就这样子反复了一段时间发现当自己要做项目时感觉还是有点懵无从下手.后来遇见一个师兄他给我推荐了技能树,他告诉我做前端最重要的就是学习的思维与思路,渐渐的我就开始接触修真院并加入班级,我运用之前看视频学过的一些知识做了任务一.
今天完成的事情:
完成了九宫格的制作,学会了如何让九宫格一排放置3个,学会了单位百分比是根据父元素的宽高设置.
遇到的问题:
1.一开始制作发现九宫格的九个格子一排排在一行不会呈现一排三个的情况.后来通过查看各师兄的日报以及一些材料只要将单位以百分比的形式设置width ,padding,margin,平均一个width占据父元素div的30%就可以解决.
发现的问题:
实现九宫格自适应以后九宫格为什么只能在电脑上可以呈现,而网页链接在手机上确访问不了这是为什么,是要进行任务二?才能实现吗还是说我哪里出现了问题,viewport我也设置了meta标签,就是没有呈现效果.
今天任务:
继续学习要加油把这些任务学会,感觉自学能力还是有待提高.加油
我的代码如下:
<!DOCTYPE html>
<html>
<head>
<meta charset="UTF-8">
<meta name="viewport" width="divce-with" height="divce-height" initial-scale="1.0" maxmum-scale="1.0" minmun-scale="1.0" user-scalable="no">
<title>tast1</title>
<style type="text/css">
body{
margin:0;
}
.jgg{
margin:0 auto;
width:100%;
}
.box1{
background-color:orange;
width:30%;
padding-bottom: 30%;
border-radius: 5%;
margin:1%;
float:left;
}
</style>
</head>
<body>
<div class="jgg">
<div class="box1"></div>
<div class="box1"></div>
<div class="box1"></div>
<div class="box1"></div>
<div class="box1"></div>
<div class="box1"></div>
<div class="box1"></div>
<div class="box1"></div>
<div class="box1"></div>
</div>
</body>
</html>
返回列表
评论