html

带你玩转css3的3D!

话不多说,先上demo酷炫css3走马灯/正方体动画: https://segmentfault.com/a/https://bupt-hjm.github.io/cs...github源码地址:https://segmentfault.com/a/https://github.com/BUPT-HJM/c...酷炫css3翻页动画: https://segmentfaul

displa 与 visibilit

项目开发中经常会遇到需要显示和隐藏DOM元素。常用的两个是display,visibility属性,高级点的会用到angularJS的ng-show,ng-if指令。W3标准对这个两个属性的解释如下:display 设置元素如何显示。visibility 设置元素是否可见。dispaly: none|inline|block - none: 此元素不会被显示。 - inli

浅谈line-height

基础知识有4种模型,分别是块,块盒模型 containing boxing,包括line行内盒模型 inline boxing ,包含content行模型 line boxing,包含inline,line高度是由最高的inline元素决定.内容区域 content area这部分内容可以着重看 这里有详细的介绍。line-height与line boxes高度由上面的内容

《JavaScript 闯关记》之初探

当学习一门新的编程语言的时候,应该边学边做,反复演练以加深理解。因此,你需要一个 JavaScript 解释器。幸运的是,每一个 Web 浏览器都包含一个 JavaScript 解释器。可以通过在 HTML 文件里写一个 元素来嵌入 JavaScript 代码,当浏览器加载 HTML 文件的时候,它会自动执行这段代码。如果运行的是一小段 JavaScript 代码,则不必

$q 实例分析angular中的promise

相信有一些开发经验的朋友就应该知道,对于JavaScript而言,promise十分重要,在开发中总能用到。因此掌握好它是一件必须做的事情。我之前写过一篇文章,工作总结:jQuery高级应用之Deferred对象,介绍jquery中的promise,因此关于promise的基础介绍就不再详细讲解,这篇文章会重点关注angular中promise的实现。我们首先有一个简单的h

css 不规整元素的宽高等比例

不规整元素的宽高等比例在不同屏幕情况中不同宽高的元素都以相同等比例、等宽和等高方式展示。需求设计师希望页面的图片区域,以宽高为2:1比例且所有图片的等宽和等高的方式展示。小加同学觉得设计师这需求太容易,分分钟搞定,拿到图片后便开始刷刷的撸代码。原型设计稿大致如下:初版思路每个图片区域宽度为父元素宽度的25%,图片的宽度设置100%,其高度根据宽度等比例自动缩放(小加以为图片

HTML语义化和SEO优化

什么是HTML语义化?  根据内容的结构化(内容语义化),选择合适的标签(代码语义化)便于开发者阅读和写出更优雅的代码的同时让浏览器的爬虫和机器很好地解析。为什么要语义化?为了在没有CSS的情况下,页面也能呈现出很好地内容结构、代码结构:为了裸奔时好看;用户体验:例如title、alt用于解释名词或解释图片信息、label标签的活用;有利于SEO:和搜索引擎建立良好沟通,有

浏览器渲染的那些事(三)

终于到了布局的部分了!布局当渲染对象被创建并添加到树中,是没有位置和大小的,计算这些值的过程称为layout或reflow。布局是一个递归过程,由根渲染对象开始,对应html文档元素,布局继续递归的通过一些或所有的frame层级,为每个需要几何信息的渲染对象进行计算。跟渲染对象位置是0,0。所有渲染对象都有一个layout或reflow方法,每个渲染对象调用需要布局的chi

切图崽的自我修养-如何提高项目的加载速度

前言我的项目没问题,是用户的网络环境不够好前端作为一个最贴近用户的技术工种,毫无疑问应该把户体验放在第一位. 而用户体验,基本正比于页面的打开速度,特别是做移动端的同学,所以如何优化自己的项目,提高页面的加载速度成为重中之重.资源的下载及解析对前端同学来说,弄清楚页面上资源的下载和解析顺序是及其重要的,知道了它们的加载顺序,就知道对于特定的场景,应该如何去优化. 一般来说,