前端学堂
学有所用

HTML5|CSS3

基础知识HTML5、CSS3以及在PC和H5页面的适配和兼容
font-face需要知道的一切-前端学堂

font-face需要知道的一切

前端学堂阅读(134)

字体是实现良好的设计、品牌推广、可读性和无障碍功能的基础。 网页字体可实现所有上述目标以及其他目标:文本可选取、可搜索、可缩放并支持高 DPI,无论屏幕尺寸和分辨率如何,均可提供一致并且锐利的文本渲染。 网页字体是实现良好的设计、用户体验和...

preload和prefetch优化-前端学堂

preload和prefetch优化

前端学堂阅读(200)

衡量网站的性能的指标有很多,其中有项重要的指标就是网站的首屏时间,为此前端工程师们都是绞尽脑汁想尽办法进行优化自己的应用,诸如像服务端渲染,懒加载,CDN 加速,ServiceWorker 等等方法,今天介绍的 preload/prefet...

LCP、TBT与CLS指标-前端学堂

LCP、TBT与CLS指标

前端学堂阅读(307)

FP (First Paint) 首次绘制 FP (First Paint) 首次绘制: 标记浏览器渲染任何在视觉上不同于导航前屏幕内容之内容的时间点. FCP (First Contentful Paint) 首次内容绘制 FCP (Fi...

css的发展现状-前端学堂

css的发展现状

前端学堂阅读(625)

随着前端工程化的不断完善,CSS 预处理器已经成为项目中不可缺少的部分,很多人在项目技术选型阶段就会先选择一个 CSS 预处理器,绝大部分前端工程的脚手架也内置了一系列的 CSS 预处理的模版,大家已经习惯了享受 CSS 预处理器带来的书写...

如何高效响应用户触摸动作-前端学堂

如何高效响应用户触摸动作

前端学堂阅读(502)

响应元素状态 您是否有过这样的经历:触摸或点按网页上的某个元素时怀疑网站是否真的检测到了您的触摸动作? 只需在用户触摸 UI 元素或与其进行交互时改变元素的颜色,用户就能基本确认网站处于工作状态。 这样做不仅能减轻用户的失望感,还能让其觉得...

media type 与media query

前端学堂阅读(386)

CSS link、@import共同点:都是为了加载CSS文件。 CSS link、@import不同点: Link属于XHTML标签,而@import完全是CSS提供的一种方式。link除了可以加载CSS外,还可以做很多其它的事情,比如定...

什么是containing block?-前端学堂

什么是containing block?

前端学堂阅读(755)

什么是containing block? 如果干巴巴的问一个前端什么是containing block。大部分都不知所云。官方示意如下: The size and position of an element are often impac...

说说http状态码和妙用-前端学堂

说说http状态码和妙用

前端学堂阅读(358)

  一些常见的状态码 1开头 1xx(临时响应)表示临时响应并需要请求者继续执行操作的状态代码。代码 说明 100 (继续) 请求者应当继续提出请求。 服务器返回此代码表示已收到请求的第一部分,正在等待其余部分。 101 (切换协...

noopener和noreferrer

前端学堂阅读(639)

ESLint的确是个好东西,在使用airbnb的JavaScript语法校验工具时,如下的<a>链接标签报出了安全错误: <a className="link" href="http://www.honeywell.com...