解锁即可观看《前端工程师2020版》完整课程视频

前端工程师2020版

前端入门如同写字,如果你不知道从哪开始,那就选择前端。(含Vue3.0正式版)

【第1周】HTML5基础语法与标签
【第2周】CSS3基础语法与盒模型
【第3周】CSS3浮动定位与背景样式
【第4周】CSS3动画与穷游首页开发实战
【第5周】JS基础语法与表达式
【第6周】JS流程控制语句与数组
【第7周】JS函数与DOM
【第8周】面向对象
【第9周】项目实战:仿穷游JS特效开发
【第10周】ES6基础入门
【第11周】ES6语法扩展
【第12周】ES6之Promise与Class类
【第13周】ES6之Module模块与Babel编译
【第14-15周】HTTP 协议、存储、Ajax
【第16周】项目实战:仿穷游组件化开发
【第17周】移动基础
【第18周】移动进阶之高效开发
【第19周】项目实战:仿穷游移动webapp开发
【第20周】小程序基础与慕课小程序实战
【第21周】React.js基础语法与新闻网站实战
【第22-23周】Sass基础与Vue.js基础语法
【第24周】项目实战:Vue.js仿京东到家电商全栈项目前端开发(上)
【第25-26周】项目实战:Vue.js仿京东到家电商全栈项目前端(下)
【第27周】全栈必备基础Node.js
【第28周】koa2中间件与MongoDB数据库
【第29-30周】项目实战:node.js仿京东到家电商全栈项目后端开发
【第31周】就业必备基础技术面试分析
【第32周】就业必备框架与全栈技术面试分析
章节
问答
课签
笔记
评论
占位
占位

长度值

长度单位总结一下,目前比较常用到px(像素)、em、% 百分比,要注意其实这三种单位都是相对单位。

1、像素

像素为什么是相对单位呢?因为像素指的是显示器上的小点(CSS规范中假设“90像素=1英寸”)。实际情况是浏览器会使用显示器的实际像素值有关,在目前大多数的设计者都倾向于使用像素(px)作为单位。

2、em

就是本元素给定字体的 font-size 值,如果元素的 font-size 为 14px ,那么 1em = 14px;如果 font-size 为 18px,那么 1em = 18px。如下代码:

p{font-size:12px;text-indent:2em;}

上面代码就是可以实现段落首行缩进 24px(也就是两个字体大小的距离)。

下面注意一个特殊情况:

但当给 font-size 设置单位为 em 时,此时计算的标准以 p 的父元素的 font-size 为基础。如下代码:

html:

<p>以这个<span>例子</span>为例。</p>

css:

p{font-size:14px}
span{font-size:0.8em;}

结果 span 中的字体“例子”字体大小就为 11.2px(14 * 0.8 = 11.2px)。

3、百分比

p{font-size:12px;line-height:130%}

设置行高(行间距)为字体的130%(12 * 1.3 = 15.6px)。

任务

本小节没有任务,请在右侧代码编辑器中测试一下本小节的两个例子代码。

?不会了怎么办
||

提问题

写笔记

截图
提交
||

请验证,完成请求

由于请求次数过多,请先验证,完成再次请求

加群二维码

打开微信扫码自动绑定

您还未绑定服务号

绑定后可得到

  • · 粉丝专属优惠福利
  • · 大咖直播交流干货
  • · 课程更新,问题答复提醒
  • · 账号支付安全提醒

举报

0/150
提交
取消
全部 精华 我要发布
全部 我要发布
最新 点赞
只看我的

手记推荐

更多

本次提问将花费2个积分

你的积分不足,无法发表

为什么扣积分?

本次提问将花费2个积分

继续发表请点击 "确定"

为什么扣积分?