发表于: 2019-02-27 21:33:25
2 950
今天完成的事情:
完成了css6
明天计划的事情:
准备着手css7
遇到的问题:
css6文字省略号,因为用了flont 所以出了点问题总是不显示,最后在师兄的帮助下用了flex,差不多也解决了、
收获:
文字省略号运用简单了解了,如果实现单行文本的溢出显示省略号同学们应该都知道用text-overflow:ellipsis属性来.当然还需要加宽度width属来兼容部分浏览
实现方法:overflow: hidden;text-overflow:ellipsis;white-space: nowrap;
实现效果如下图
实现方法的
display: webkit-box;
-webkit-box-orient: vertical;
-webkit-line-clamp: 3;
overflow: hidden;
效果图如下
这样基本可以清楚直观了解文字省略号的两种写法。
任务一总结;
让我直观了解了互联网的用途,毕竟是刚了解web前端好多东西都是新生的,陌生的,新颖的,都需要不断慢慢的去了解。任务一简单了解了盒子模型的运用,能用盒子模型简单制作九宫格,盒子模型我们要了解盒子的组成,盒子模型是由内容(content)、内边距(padding)、边框(border)、外边距(margin) 组成,content就是盒子的内容就是一个盒子中间的部分可以在里面添加文字之类的样式,内边距就是盒子内容周围的区域,注意一点内边距是透明的,边框就是包裹在内边距一周的框架,外边距就是边框四周的部分,注意一点外边距样式透明的,任务一的九宫格就是利用盒子模型的原理来制作的先给盒子一个宽高,然后在定位颜色,利用边角变圆属性让盒子变圆,最后就是利用外边距内边距的浮动调整盒子的位子,最终实现九宫格的效果。
深度思考
第一.什么是html,对他有什么认知,html是什么什么概念?
随着网络的不段普及,网页已经被大多人知道并广泛运用,大家每天浏览的网站都是由一页页网站所构成,但是这个网页是怎么显示和构建出来就是由一种简单的标记语言html构成的。
第二要明白一个网页形成需要什么用到什么?
需要css加html搭配运用,css与html的搭配运用,用这个代码<link rel="stylesheet" href="style.css"/>,把你想要写的style写到css文件夹里面,这样就简单明了,不容易搞混。
第四就是书写代码开头结尾需要什么代码还是格式
第五 做九宫格需要了解什么?
首先要知道九宫格是由什么构成?简单来说就是由九个一模一样的盒子组成,然后盒子有什么构成,这样就需要了解盒子模型;
盒子模型是样式表(css)控制页面的很重要的概念。如果理解了盒子模型和其中每个元素的用法,才能熟练使用css的定位方法和技巧。所有的页面的元素都可以看成是一个盒子,占据一定的页面空间。占据的空间要比实际使用的空间要大得多。我们可以调整盒子的边框和距离,来调整盒子(页面和页面中的元素)的位置。盒子模型是由内容、边框、间隙(padding)、间隔(margin)组成,他们的关系如下图所示:
另外就是浮动问题,float浮动,float left左浮,float right 右浮 由于浮动框不在文档的普通流中,所以文档的普通流中的块框表现得就像浮动框不存在一样,上TOP下bottom左 left右right,利用padding外边距还有margin内边距左右上下浮动改变盒子的位置,刚开始肯定不熟练运用,多看多记多用,肯定能熟练掌握的。
第六九宫格边角边圆 border-radius: 这个代码加上简单的字数加单位就能实现边角变圆,下面就是运用了 border-radius 属性的四方形格子
任务2总结
任务2就是认识开发必备工具Github,通过这个任务能学到:1.学习版本管理工具; 2.学习使用服务器; 3.学习如何将自己的代码放到网上去,首先就是需要访问github注册一个帐号,然后查看学习资料怎样使用Github,在github上创建一个项目:start a project,将项目clone到本地,在本地项目中编写任务代码,安装git软件,然后上网查看教程如何
git,如果是使用webstorm的可以将git可执行文件配置到webstorm配置的版本管理git上,使我们可以通过webstorm可视化直接进行git操作,本地代码先add到版本管理中,再commit提交,最后push到服务器,毕竟是第一次接触好多东西都是师兄帮忙做的,当然自己也要学会这需要自己不断去摸索。
放
深度思考;
第一什么是github?
2018年6月4日,微软宣布,通过75亿美元的股票交易收购代码托管平台GitHub。
第二github的用途?
1.代码托管
就是我们做的最多的,上传代码,云端备份,可以想象成一个云盘。
2.项目管理
GitHub最初是为了开发的管理而生,当然也就具备了项目管理的潜质,特别是与开发密切联系的项目中,它的优势尽显。
3.Github Pages
可以为项目建立静态主页(即gh-pages分支), 就是搭建个人网
第三怎么样下载和运行GitHub上的代码呢?
如何从GitHub上下载自己需要的项目:
1.首先,你要有一个自己的GitHub(https://github.com/)的账号。关于如何注册GitHub的账号以及如何获取你的SSH密钥这个问题,请大家参考https://blog.csdn.net/p10010/article/details/51336332。当然,最好是自己去网上搜索一下。
2.你需要安装Git。关于这个问题,我想,廖老师的https://www.liaoxuefeng.com/里面的Git教程,讲的就再详细不过了,这里我就不再赘述了。
.后面下载你所需要的项目:
登录你的GitHub账号:
通过关键字,搜索你需要的项目
下载项目
这里可以看到clone or download,如果你安装了GitHub的客户端的话,那么你直接点左下角的Open in Desktop,就可以在你本地的客户端直接打开。如果你想直接下载的话,那么就点击右下角的Download Zip,可以直接下载项目的压缩包到你的电脑上。这两种方式基本上属于一看就能明白的,我这里也就提一嘴。
值得注意的是,如果你这两种方式都不想用,而是想要通过git clone ...的方式下载项目的话。那么请注意看接下来的操作。
通过HTTP的方式克隆项目:
如果你的账号没有添加SSH密钥,那么你可以用HTTP的方式克隆项目。
.点击红色框圈住的位置,复制项目地址
.打开你想要存储的该项目的位置(如E:\Project),鼠标右键,点击Git Bash Hear,弹出Git命令窗口,输入
git clone 你复制的项目地址,如下所示,然后回车
当弹出如下所示的时候,表示你已经下载成功了。
这个时候,你再进入你保存文件的位置,就会发现已经有一个文件夹了。
.通过SSH的方式下载项目。
如果你是登录的状态,并且已经添加过SSH密钥,那么你在点击Clone orDownload的时候,就会出现:
那么就如同上面通过HTTP的方式下载项目一样,复制ssh的克隆地址。然后在Git Bash的命令窗口输入git clone 你复制的地址,回车,然后直到出现下一个$的时候,表示下载成功。
第四.如何运行你下载的项目。
一般在你下载的项目文件里会有README.md文件,里面会提供你启动项目的方法,但需要注意的是:
如果你没有安装node.js和npm的话,建议你先安装这个,这里我就不具体讲怎么安装了
下载下来的项目,需要进入这个项目文件夹,然后右键->Git Bash Here,安装依赖环境 :npm install //安装完成之后,会在你的项目文件夹里看到node_modules文件,然后按照README.md的提示启动就好啦~
评论