前端
关注
分享
扫一扫
文章平均质量分 73
MuffinFish
这个作者很懒，什么都没留下…
展开
-
前端笔记（一）：CSS的覆盖
在页面中，我们常用id、class以及内联样式表来设置我们的组件CSS。有时候我们为了编码的简便会使用CSS库，这些库会设置好全局的CSS，但是有某几个组件我们不想使用CSS库中定义的样式而想用别的特别的样式怎么办呢？解决方法就是：使用自定的CSS样式覆盖之前的CSS样式CSS中的优先级大体是：内联样式>id引用>class原创 2017-10-29 15:17:58 · 1566 阅读 · 0 评论 -
CSS:元素和基本定位
对基础的元素和定位作个总结，原文发表在我的个人博客：kmknkk.xin元素通常来说，元素分为块级元素和行内元素两大类，当然还有inline-block等其他元素，这里主要介绍这三类。块级元素(disply：block)块级元素显示为一块内容（即”块框”），若不做其他处理（如float:left）一般为一个接一个竖直排列。块级元素的垂直距离由垂直外边距决定，可能会发...原创 2018-07-22 00:17:41 · 332 阅读 · 0 评论 -
性能优化：浏览器渲染
个人博客原文链接 在聊浏览器渲染之前，我们先明确一个概念： 事实上，我们看到的页面并不是直观所见的一层图页，而是由许多DOM元素渲染层(Layers)组成的，如下图。 页面的渲染过程一个的页面的渲染过程由如下几步构成： * 构建渲染树(Render Tree): 根据DOM和CSSOM树渲染，不可见元素不被会渲染 * 布局(layout): CPU根据渲染树布...原创 2018-07-05 00:21:16 · 480 阅读 · 0 评论 -
详解JavaScript中的this
由于JavaScript的this不同于C++、JAVA等语言，在开发中容易造成一些困扰，故总结一下Javascript中的this知识，以免踩坑。 个人博客原文链接：点此前往 this指向问题一般情况this的指向不是由函数定义在哪个对象里面决定的，而是函数执行时由谁”唤醒”或者说调用来决定的，即调用时才对this做绑定，而不是定义时。箭头函数如果...原创 2018-07-05 00:18:44 · 357 阅读 · 0 评论 -
详解 var & let & const
本篇内容：梳理var、let、const的用法及注意事项 原文链接: 点此查看var存在变量提升：只提升声明语句，不提升赋值语句我们来看下面这段代码var foo = {n:1};(function(foo){ console.log(foo.n); foo.n = 3; var foo = {n:2}; console.lo...原创 2018-07-03 01:03:56 · 539 阅读 · 0 评论 -
当我们在浏览器中输入一个URL后，发生了什么？
(1)浏览器解析(2)查询缓存(3)DNS查询顺序如下，若其中一步成功则直接进去建立链接部分： - 浏览器自身DNS - 操作系统DNS - 本地hosts文件 - 像域名服务器发送请求(4)建立链接 * TCP三次握手(three-way handshaking) * 发送方:SYN(synchronize) * 接收方:SYN/ACK(acknow...原创 2018-03-06 17:27:56 · 3211 阅读 · 0 评论 -
HTML常用头部标签
基本标签<!DOCTYPE html> <!-- 使用 HTML doctype，不区分大小写 --><meta charset='utf-8'> <!-- 声明文档使用的字符编码 --><html lang="zh-CN"> <!-- 页面采用中文（中国大陆范围，包括各种大方言、小方言、繁体、简体等等） -..原创 2018-02-25 00:10:09 · 4830 阅读 · 0 评论 -
CSS三栏布局
原帖 - 个人博客链接三栏布局在前端开发中特别常见，即两端固定中间自适应。 下面就来介绍一下常用的三栏布局开发方式。例如：高度固定为200px，两边固定为200px，中间自适应，效果如图： (1)Float方法原理：元素浮动后，脱离文档流。左右栏分别浮动在窗口两边，中间块(处于文档流中)受左右浮动影响被卡在中间无法继续向左右伸展已达到自适应，最后按需设置中间...原创 2018-03-03 22:59:41 · 418 阅读 · 0 评论 -
JavaScript创建对象的几种方式
工厂模式工厂模式通过函数接收参数来封装创建对象。 包括以下步骤：1.创建封装函数 2.显示地创建对象 3.将接收的参数和方法赋值给该对象 4.将创建的对象返回给实例如下面例子：function createPerson(name, age, job) { var o = new Object(); o.name = name; o....原创 2018-02-26 19:54:59 · 234 阅读 · 0 评论 -
教你从零开始用WebSocket打造一个IM聊天室
之前我们在 IM即时聊天室（一）：WebSocket 和 IM即时聊天室（二）: Socket.io + Node.js 两篇文章中介绍了搭建一个IM的所需的技术栈和通信原理。那在这篇文章里我们就来详细说一下具体的应用并提供完整源码。 个人Blog地址：IM即时聊天室（三）：项目详解及源码分析聊天室在线地址：点此进入PS: 这是我网络编程课的一个小作业，因为博主比较...原创 2018-02-02 15:54:12 · 14878 阅读 · 5 评论 -
CSS中的元素和定位
个人博客地址：CSS中的元素和定位元素块级元素(display：block)：p、h1、div等元素 这些元素显示为一块内容，即”块框”行内元素(display：inline)：strong、span等元素 这些内容显示在行中，即”行内框”行内盒元素（display：inline-block）：顾名思义，这个定义使得元素像行内元素一样水平依次排列，但是框的内容仍然符合块级框的原创 2018-01-05 20:19:27 · 444 阅读 · 0 评论 -
IM聊天室（一）：WebSocket
1、什么是WebSocket?它和Socket有什么关系？在网络中，两个程序（进程）需要全双工通信，即双方可以同时向对方发送消息，需要用到的就是Socket，它能够提供端对端通信。具体的实现过程如下：客户端：创建一个Socket实例，并且提供服务端的IP和端口，如：192.168.1.1:8081服务端：创建另一个Socket并绑定本地端口进行监听，如：localhost:8081两者约定的端原创 2017-12-18 19:11:29 · 1630 阅读 · 0 评论 -
前端笔记（二）：Bootstrap环境配置
1、下载相关生产环境文件分别到： http://v3.bootcss.com/getting-started/#download http://jquery.com/download/ 下载最新的Bootstrap、jQuery生产环境文件，因为Bootstrap.js依赖于jQuery.js。如果觉得麻烦也可以直接到我的优快云文件下载： http://download.csdn.ne原创 2017-11-01 12:52:39 · 342 阅读 · 0 评论 -
浅谈BFC
写在前面：本文是我在看了CSS：潜藏着的BFC、为什么这么多人讲不清楚 BFC两篇文章后做做出的关于CSS的总结，如有错误与不足，欢迎指正，不胜感激！ Blog地址：浅谈BFC，欢迎来逛一、什么是BFC（Block Formatting Context）我们先来看BFC的定义：块级格式化上下文，指一个独立的块级渲染区域，该区域有一套渲染规则来约束块级盒子布局,浮动层元素可再次进行交互,且与区原创 2017-12-12 19:37:43 · 218 阅读 · 0 评论 -
探究React的生命周期
原文发表在我的个人博客：kmknkk.xinReact-component-cycleReact的生命周期（这里指的是初版的生命周期，而非新的React生命周期）主要由 挂载，运行，卸载三个阶段构成，驱动着View层更新，接下来我们来详细看看这几个阶段都发生了什么。- Mounting(挂载阶段) - Updating(运行阶段) - Unmount...原创 2018-07-23 00:56:33 · 347 阅读 · 0 评论