发表于: 2018-08-23 23:55:33

1 593


今天完成的事情

安装“Visual Studio”,并搭建了常用的插件。

创建了HTML文件进行网页的编辑。

使用<style>给div元素定义了宽度、高度、背景颜色、外边距、圆角和浮动。 

 div{

        width:31.3%;

        padding-bottom: 31.3%;

        background-color:orange;

        margin:1%;

        border-radius:10%;

        float:left;

     }  

给body定义了外边距为零,上边距、右边距、左边距绝对定位,单位1%。

 body{

         margin: 0;

         position:absolute;

         top:1%;

         right:1%;

         left:1%;

        }

之后再body标签中放置了9个div元素组成了九宫格。

明天计划的事情

进一步了解git,在github创建一个git仓库作为远程库,并和本地库进行关联,然后进行任务1的上传.

在github上创建创建项目,学习远程困复制到本地的方法.

遇到的困难

第一次编写九宫格时,选择了使用--width:31.3%;height:31.3%;导致无法撑开元素块,随后把height:31.3%的“%”更改成为“vw”,解决了元素块无法撑开的问题。但是长宽比不能一致,最后使用了padding-bottom:31.3%成功达成了长宽比的一致.

git本地库和github远程库的关联失败了几次,还没找到解觉方法。

收获

通过九宫格的编写过程学会了选择器、style的应用,理解了盒子模型,学会了内容、内边距、边框、外边距之间的关系,以及padding、margin、属性的应用。浮动属性可以重新定义元素的显示位置。百分比单位的使用可以使网页内容随网页的缩放进行等比例缩放。




返回列表 返回列表
评论

    分享到