- 博客(35)
- 收藏
- 关注
RSS订阅原创 jQuery基础
学习笔记：jQuery库本质上还是JavaScript代码，它只是对JavaScript语言进行包装处理，为的是提供更好更方便快捷的DOM处理与开发中经常使用的功能，jQuery是一个类数组对象，而DOM对象就是一个单独的DOM元素。1、将jquery对象转成DOM对象 （1）数组下标读取jQuery中的DOM 例：HTML中： <div>星期一</...
2018-07-31 16:24:07
156
原创 px、em和rem三者区别
px像素（Pixel）。相对长度单位。像素px是相对于显示器屏幕分辨率而言的。特点：1. IE无法调整那些使用px作为单位的字体大小；2. 国外的大部分网站能够调整的原因在于其使用了em或rem作为字体单位；3. Firefox能够调整px和em，rem，但是96%以上的中国网民使用IE浏览器(或内核)。pt是一个物理长度单位，指的是72分之一英寸。9pt=...
2018-07-30 16:45:26
335
原创 子元素全部浮动时如何解决父元素无法撑开？
问题描述：在我们让元素浮动的时候，它就会离开原来的文档流，将它原先占有的空间释放。打个比方，父元素就如一个有伸缩性的容器，而子元素就如一个气球。当没有设置容器的高宽时，他的高宽完全是被装在里面的气球撑开的，当子元素浮动时候，就像气球从容器里飘了出来，飘在了他的上方。而此时容器也就空了，由于伸缩性，高度就变为了o，看不见了。而我们想要父元素显示出来，正常得被子元素撑开，怎么做呢？ ...
2018-07-29 21:44:52
784
原创 前端PS切图技巧（二）
之前介绍了传统的切图技巧，主要用于切多张图片的时候，但很多时候我们可能只需要切一两张图标，如果还用传统的方法就会很繁琐，所以这次分享一种导出单个图标的方法。没有psd文件的，我这里准备了一份，需要的可以去下载psd练习文件 (和之前的一样)http://pan.baidu.com/s/1pL2dwL11工具：一、二是用photoshop cs6演示的，三是用photoshop ...
2018-07-28 19:46:10
439
原创 前端PS切图技巧(一)
UI给我们设计图的时候都会有一份设计原稿psd文件，有的公司可能UI会把需要的图标给切好，更多时候是需要我们自己来切的。而且，有的时候可能需要的东西UI没有切出来，你就要去是去找UI切好了再发给我们，这个过程就变得很麻烦，所以不如自己学一些切图方法 没有psd文件的，我这里准备了一份，需要的可以去下载psd练习文件http://pan.baidu.com/s/1pL2dwL11...
2018-07-28 19:18:12
1360
1
原创 CSS实现各种方向三角形
我们的网页因为 CSS 而呈现千变万化的风格。这一看似简单的样式语言在使用中非常灵活，只要你发挥创意就能实现很多比人想象不到的效果。特别是随着 CSS3 的广泛使用，更多新奇的 CSS 作品涌现出来。今天给大家带来 CSS 三角形绘制方法代码如下:#triangle-up { width: 0; height: 0; border-left: 50px s...
2018-07-27 22:03:55
701
原创 CSS盒子模型+如何使用CSS实现三角形
盒子模型前言盒子模型，英文即box model。无论是div、span、还是a都是盒子。但是，图片、表单元素一律看作是文本，它们并不是盒子。这个很好理解，比如说，一张图片里并不能放东西，它自己就是自己的内容。盒子中的区域一个盒子中主要的属性就5个：width、height、padding、border、margin。如下：width和height：内容的宽度、高度（不...
2018-07-27 21:46:21
1690
原创 canvas基础教程
01.canvas简单的认识canvas 是html5提供给我们的一个绘图标签 默认大小 300X150 背景透明<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>canvas简单的认识</titl
2018-07-27 11:11:28
350
原创 HTML通过canvas实现简单的画图功能
功能描述： 有红绿蓝三种颜色的画笔，可以选择画笔的粗细，画出的图可以保存到右边的六个画框中。当右边的六个画框都画满之后，便不能继续保存来了。可以清除画框，清除画布。保存的图片可以右击保存为png格式。实现效果如图所示： 实现代码：<!DOCTYPE html><html lang="en"><head> <meta cha...
2018-07-25 23:33:12
5236
原创 关于CSS与HTML知识点总结（二）
HTML知识点整理置换元素：浏览器根据标签和属性来决定元素的具体显示内容，如 img input textarea select object video 等Form <input type='radio'>的选择变化可由onfocus属性控制 <select>的变化可由onchange属性控制 selectedIndex对应当前选中option的in...
2018-07-25 09:00:20
141
原创 关于CSS与HTML知识点总结（一）
一，html+css基础1-1Html和CSS的关系学习web前端开发基础技术需要掌握：HTML、CSS、JavaScript语言。下面我们就来了解下这三门技术都是用来实现什么的：1. HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息，可以包含文字、图片、视频等。2. CSS样式是表现。就像网页的外衣。比如，标题字体、颜色变化，或为标题加入背景图片、边框等。所有...
2018-07-24 23:28:22
254
原创 关于绝对路径与相对路径的理解
1.绝对路径 先说在本地计算机上，文件的绝对路径当然是指：文件在硬盘上真正存在的路径。 例如这个路径：D:/wamp/www/img/icon.jpg告诉我们icon.jpg文件是在D盘的wamp目录下的img子目录中。我们不需要知道其他任何信息就可以根据绝对路径判断出文件的位置。 还有超链接文件位置，也属于绝对路径，例如http://www.img.ne...
2018-07-24 23:12:34
789
原创 关于html5和css3的一些常见面试题
一、HTML5 CSS3CSS3有哪些新特性？1. CSS3实现圆角（border-radius），阴影（box-shadow），2. 对文字加特效（text-shadow、），线性渐变（gradient），旋转（transform）3.transform:rotate(9deg) scale(0.85,0.90) translate(0px,-30px) skew(-9deg,0d...
2018-07-22 23:18:48
666
原创 响应式布局之二 SS3 Media Query
响应式布局有三种实现方式：CSS3 Media Query 原生 JS 代码 第三方开源框架（最常见的有 bootstrap） CSS3 -- Media Query1. 媒体查询实现方式方式一：styleSheet样式表中的写法：如：<style>标签中使用@media <style> @media screen and ...
2018-07-22 23:10:28
127
原创 响应式布局之一 bootstrap栅格布局
bootstrap根据不同屏幕尺寸，选择不同的栅格选项。一共有四种栅格选项，超小屏（手机）、小屏（平板）、中屏（桌面）、大屏（超大桌面）。栅格系统分为12列，即每行最多可容纳12列。若<HTML>里，一个.row内包含的列（column）大于12个（即，一行中的栅格单元超过12个单元），则会自动排版，总之，一行只能最多12列，具体分析往后阅读。 一、 栅格系统的使用使用...
2018-07-22 23:09:34
617
原创 关于CSS浮动讲解
教程开始： 首先要知道，div是块级元素，在页面中独占一行，自上而下排列，也就是传说中的流。如下图： 可以看出，即使div1的宽度很小，页面中一行可以容下div1和div2，div2也不会排在div1后边，因为div元素是独占一行的。 注意，以上这些理论，是指标准流中的div。 小菜认为，无论多么复杂的布局，其...
2018-07-20 12:15:27
266
原创 HTML常用标签
HTML文档采用目录树这样一种结构，基本结构如：<!DOCTYPE html><html><head><title>文档的标题</title></head><body>文档的内容......</body></html>第一行声明浏
2018-07-19 18:57:38
288
原创 CSS选择器实例
元素选择器E，选择所有指定元素名称的元素，例如 p，选择所有的 p 元素。通用选择器*，选择所有元素，例如： * { box-sizing: border-box; } 类选择器.class，用一个点号加类名表示，例如 .header，选择所有 class 属性中包含 header 的元素。 <div cla...
2018-07-19 12:01:59
368
原创 CSS3选择器总结
一，CSS3 选择器分类二，选择器语法1，基本选择器语法选择器 类型 功能描述 * 通配选择器 选择文档中所以HTML元素 E 元素选择器 选择指定类型的HTML元素 #id ID选择器 选择指定ID属性值为“id”的任意类型元素 .class 类选择器 选择指定class属性值为“class”的...
2018-07-19 11:59:38
116
原创 javascript基础算法题
本文汇集了js的一些基础算法题，很多互联网公司在招聘初级前端开发工程师（应届生）时，都喜欢让应聘者做一些js算法题，这时，若你学会了这些js基础算法题的解题思想对你很有帮助，有一些甚至可以直接套用，所以，建议应届生面试前务必看一遍。题目题目1：翻转字符串。解题思路：1、split（）字符串转成数组；2、reverse()翻转数组；3、join()数组转化成字符串。 ...
2018-07-18 23:41:13
325
原创 关于CSS优先级算法是如何计算？
在面试之前对css优先级的理解是 ：ID优先级>class>元素选择器，外联样式优先级低于内联样式，内联样式优先级低于行间样式，然后就没有然后了……，ID选择器的优先级确实>class选择器的优先级>元素选择器的优先级，但是外联样式优先级并不一定低于内联样式优先级。做为一个合格的前端工程师，让我们彻底搞清楚css优先级计算规则吧！ 特殊性 css继承是...
2018-07-18 23:40:06
357
原创 36道前端面试题html+css
1. 对WEB标准以及W3C的理解与认识?标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件，容易维护、改版方便，不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性;定制这些标准主要是为了提高网页加载速度，便于开发。同时这也是一...
2018-07-18 21:21:16
336
原创 关于H5的20道面试题及答案
1 DOCTYPE有什么作用？标准模式与混杂模式如何区分？它们有何意义?告诉浏览器使用哪个版本的HTML规范来渲染文档。DOCTYPE不存在或形式不正确会导致HTML文档以混杂模式呈现。标准模式（Standards mode）以浏览器支持的最高标准运行；混杂模式（Quirks mode）中页面是一种比较宽松的向后兼容的方式显示。2 HTML5为什么只需要写 ？HTML5不基于SGM...
2018-07-18 21:20:31
41134
原创 超全前端面试题及答案
HTML+CSS1.对WEB标准以及W3C的理解与认识标签闭合、标签小写、不乱嵌套、提高搜索机器人搜索几率、使用外 链css和js脚本、结构行为表现的分离、文件下载与页面速度更快、内容能被更多的用户所访问、内容能被更广泛的设备所访问、更少的代码和组件，容易维 护、改版方便，不需要变动页面内容、提供打印版本而不需要复制内容、提高网站易用性；2.xhtml和html有什么区别HTML是一种基...
2018-07-18 21:19:31
2913
原创 关于css3的50道常见面试题
1 介绍一下标准的CSS的盒子模型？与低版本IE的盒子模型有什么不同的？标准盒子模型：宽度=内容的宽度（content）+ border + padding + margin低版本IE盒子模型：宽度=内容宽度（content+border+padding）+ margin2 box-sizing属性？用来控制元素的盒子模型的解析模式，默认为content-boxcontext-bo...
2018-07-18 21:18:02
28090
原创 如何创建一个vue项目
详细版：（下方有精简版，推荐）一、nodejs的安装Node.js安装包及源码下载地址为：https://nodejs.org/en/download/。我们可以根据不同平台系统选择你需要的Node.js安装包。Node.js 历史版本下载地址：https://nodejs.org/dist/这里演示的是Window64位安装Node.js，下面演示的是采用安装包的方式来...
2018-07-18 15:32:10
628
原创 关于Vue.js和Vue.js的优缺点以及和与其他前端框架的区别
首先，我们先了解什么是MVX框架模式？MVX框架模式：MVC+MVP+MVVM1.MVC：Model(模型)+View(视图)+controller(控制器)，主要是基于分层的目的，让彼此的职责分开。View通过Controller来和Model联系，Controller是View和Model的协调者，View和Model不直接联系，基本联系都是单向的。用户User通过控制器Con...
2018-07-17 00:20:02
2166
原创 为什么在vue的组件中，data要用function返回对象呢？
官方文档告诉我们当一个组件被定义， data 必须声明为返回一个初始数据对象的函数，因为组件可能被用来创建多个实例。如果 data 仍然是一个纯粹的对象，则所有的实例将共享引用同一个数据对象！通过提供 data 函数，每次创建一个新实例后，我们能够调用 data 函数，从而返回初始数据的一个全新副本数据对象。这么理解如果不用function return 每个组件的data都是内存的同一个地址...
2018-07-17 00:19:00
875
原创 npm与cnpm
npm介绍说明：npm（node package manager）是nodejs的包管理器，用于node插件管理（包括安装、卸载、管理依赖等）使用npm安装插件：命令提示符执行npm install <name> [-g] [--save-dev] <name>：node插件名称。 例：npm install gulp-less --save-dev-g：全局安装。 将会安...
2018-07-15 17:53:47
650
原创 mac如何使用Git上传本地项目到github?
在此假设你已经在 github 上创建好了一个项目，像这样：并且你已经完成了自己的项目代码，同时你也已经安装了 git，然后 let's start.（以下所以命令中如果那个命令如果输入后无反应，可以在命令前加sudo，即可解决）首先，建一个文件夹比如文中演示的是 微信小程序 文件夹，然后打开的你的终端，定位到该文件夹，然后输入命令: git init然后配置 ssh , 输入：ssh-keyge...
2018-07-15 12:39:48
6602
原创 行内元素与块级元素
在标准文档流里面，块级元素具有以下特点：块级元素写完后会自动换行，有宽高可以修改。①总是在新行上开始，占据一整行；②高度，行高以及外边距和内边距都可控制；③宽带始终是与浏览器宽度一样，与内容无关；④它可以容纳内联元素和其他块元素。行内元素的特点：行内元素指的是书写完成后不会自动换行，并且元素没有宽和高。①和其他元素都在一行上；②高，行高及外边距和内边距部分可改变；③宽度只与内容有关；④行内元素...
2018-07-15 01:49:08
160
原创 CSS 问题 中 li{display:inline;}的作用
<html><head><style type="text/css">ul{list-style-type:none;width:100%;padding:0;margin:0;float:left;}a{text-decoration:none;float:left;background-color:green;width:120px;font-size:15...
2018-07-15 01:39:10
1484
原创 关于相对定位与绝对定位的区别
之前一直搞不明白html中positon:relative; 和 position:absolute;这两个属性。这里记录一下。理论解释：相对定位：该元素相对于自己原有位置，偏移一定距离。相对的是自己。绝对定位：该元素相对于其父元素，偏移一定距离。相对的是父元素，重点是这个父元素也需要是设置了position属性。从最近的父元素开始找，直到找到body位置为止。好吧，光看理论解...
2018-07-15 00:57:13
33397
7
原创 css固定定位与绝对定位的区别
绝对定位中当一个DIV块的位置被定义为绝对定位的时候，也就失去了文档流即失去原本的位置，并且以父级为基准(父级元素必须是相对定位如果不是则一直往上找，直到找到body为止)来进行偏移, 固定定位其实和绝对定位有很多相似之处只不过是基于当前页面来偏移。 我们可以用代码来验证代码如下: <!DOCTYPE html PUBLIC "-//W3C//DTD XHTML ...
2018-07-14 18:20:10
5731
1
原创 关于对html中文档流的理解
理解好文档流，有助于我们对css中定位和浮动的理解。什么是文档流呢，经过我看过的一些文章，加入自己的理解。我得出文档流的定义如下： 1、从左至右，从上至上的布局。 2、符合html中标签本身含义的布局，比如某些标签独占一行。有些标签属于行内元素等。 下面来讲一个css中的定位机制，共三种： 1、正常的文档流 2、float 3、postion 在这几种定位机制中，有几种方式是脱离文档...
2018-07-14 18:14:33
399
空空如也
空空如也
TA创建的收藏夹 TA关注的收藏夹
TA关注的人