博客新增音乐播放器,点击打开捷径,切换或暂停音乐。

随笔分类 -  前端积累

摘要:什么是事件? 事件是一种异步编程的实现方式,本质上是程序各个组成部分之间的通信。就是文档或浏览器窗口发生的一些特定的交互瞬间(某种动作)。 1、事件流 事件流描述的是从页面中接收事件的顺序。 1)事件冒泡 2)事件捕获 2、冒泡机制 事件从最具体的元素开始向上依次出发,到最外面的元素 d1.addE 阅读全文
posted @ 2018-04-16 23:16 霓裳梦竹 阅读(164) 评论(0) 推荐(0) 编辑
摘要:前言 之所以要看这个,是因为在看到的一个网站里图表显示的全屏和缩小,anyway ,还是看一下咯~ 一、介绍 二、主要功能 1、一个字体文件,249个图标 一个字体文件包含了所有图标。Font Awesome 助你完整表达web页面上每个动作的含义 2、用CSS控制样式 用CSS能非常容易的改变这些 阅读全文
posted @ 2018-01-26 12:54 霓裳梦竹 阅读(557) 评论(0) 推荐(0) 编辑
摘要:前言 一、transition-property 二、transition-durtion 三、transition-timing-function 四、transition-delay 阅读全文
posted @ 2017-09-28 17:02 霓裳梦竹 阅读(740) 评论(0) 推荐(0) 编辑
摘要:前言 Transform字面上是变形,改变的意思,在CSS3中transform主要包括如下几种 旋转rotate 扭曲skew 缩放scale 移动translate 矩形变形matrix 一、旋转rotate 二、translate 三、缩放 四、扭曲skew 五、矩阵matrix transf 阅读全文
posted @ 2017-09-28 15:44 霓裳梦竹 阅读(519) 评论(0) 推荐(0) 编辑
摘要:前言 动画使用示例https://github.com/AndyFlower/web-front/tree/master/css3/loading 学习CSS3中Animation之前先来看一个动画特效(可以自己运行看下实际效果) 在学习Animation之前必须先了解“Keyframes”,我们把 阅读全文
posted @ 2017-09-28 13:19 霓裳梦竹 阅读(1398) 评论(0) 推荐(0) 编辑
摘要:一、养成良好的编码习惯,提高可维护性 1、避免定义全局变量和函数,解决全局变量而导致的代码“污染”最简单的额方法就是把变量和方法封装在一个变量对象上,使其变成对象的属性: 还可以将全局的变量包含在一个局部作用域中,然后在这个作用域中完成这些变量的定义以及变量使用的逻辑: 模块之间交互使用return 阅读全文
posted @ 2017-09-19 09:09 霓裳梦竹 阅读(321) 评论(0) 推荐(0) 编辑
摘要:一、有效组织CSS代码 规划组织CSS代码:组织CSS代码文件,所有的CSS都可以分为2类,通用类和业务类。代码的组织应该把通用类和业务类的代码放在不同的目录中。 模块内部的另一样式规则:样式声明的顺序是按照模块中元素的层级关系来处理,从父级元素开始,如果是同一级元素则按照元素在页面的位置从上到下。 阅读全文
posted @ 2017-09-18 09:32 霓裳梦竹 阅读(288) 评论(0) 推荐(0) 编辑
摘要:一、HTML语义化 HTML5中增加了很多标签都是基于此类原则设计的(article nav header footer)。页面标签语义化的优点是使得搜索引擎以及第三方抓包工具等更容易读懂页面代码、提高可读性。 如果图片是作为网页内容的一部分,则应该使用<img>元素,如果图片仅仅是起装饰作用,则应 阅读全文
posted @ 2017-09-15 09:35 霓裳梦竹 阅读(150) 评论(0) 推荐(0) 编辑
摘要:一、常用的前端文件的组织结构: 1、js (放置JavaScript代码) lib(放置框架JavaScript文件) custom.js 2、css(放置CSS样式代码) lib(放置框架CSS文件) images(放置用于样式中的背景图) reset.css( 统一元素默认样式的样式文件) cu 阅读全文
posted @ 2017-09-13 09:29 霓裳梦竹 阅读(414) 评论(0) 推荐(0) 编辑
摘要:在页面上没有设置width所以样式显示有问题,本来选择的响应式模式的320*410结果看到页面的实际宽度确实980px。 本文转载自: 在移动设备上进行网页的重构或开发,首先得搞明白的就是移动设备上的viewport了,只有明白了viewport的概念以及弄清楚了跟viewport有关的meta标签 阅读全文
posted @ 2017-09-12 17:38 霓裳梦竹 阅读(366) 评论(0) 推荐(0) 编辑
摘要:实时数据进度条 0% 阅读全文
posted @ 2017-08-06 17:18 霓裳梦竹 阅读(337) 评论(0) 推荐(0) 编辑
摘要:头部进度条 阅读全文
posted @ 2017-08-06 17:16 霓裳梦竹 阅读(434) 评论(0) 推荐(0) 编辑
摘要:基本列表样式 添加定制的列表符号,可以使用list-style-image属性,但是控制符号位置不方便,常用的是关闭符号,并且将定制的符号作为背景添加在列表元素上,然后可以使用背景图像的定位属性精确的控制定制符号的对准方式。 添加定制的符号非常简单,在列表项左边添加填充,为符号流出所需的空间。然后将 阅读全文
posted @ 2017-04-08 01:01 霓裳梦竹 阅读(153) 评论(0) 推荐(0) 编辑
摘要:简单的链式样式 对链式应用样式最容易的方式是使用类型选择器:a{color:red;}将所有的锚设为红色。但是锚既可以设为内部应用,也可以作为外部链接,所以使用类型选择器不总是理想的。为了避免这个问题,CSS提供了两个特殊的选择器,称为伪类选择器。:link伪类选择器用来寻找没有被访问过的链接,:v 阅读全文
posted @ 2017-04-06 22:51 霓裳梦竹 阅读(196) 评论(0) 推荐(0) 编辑
摘要:背景图像基础 如果希望网站有一个好看的背景,那么只需将图像作为背景应用于主体元素: 浏览器默认的行为是水平和垂直地重复显示这个图像,让图像平铺在整个页面上。可以选择背景图像是垂直平铺、水平拼购还是根本不平铺。 目前渐变非常流行,如果希望构建出垂直渐变,我们可以创建一个很高很窄的渐变图像,然后将这个图 阅读全文
posted @ 2017-03-31 09:20 霓裳梦竹 阅读(730) 评论(0) 推荐(0) 编辑
摘要:三个最重要的控制页面安排和显示元素的方式:浮动、定位、框模型。 框模型: 框模型是CSS的基石之一,它指定元素如何显示一级如何相互交互。页面上的每个元素都被看成一个矩形框,这个框由元素的内容、填充、边框和空白边组成。 填充出现在内容区域的周围。如果在元素上添加背景,那么背景会应用于由内容和填充组成的 阅读全文
posted @ 2017-03-29 13:17 霓裳梦竹 阅读(227) 评论(0) 推荐(0) 编辑
摘要:常用选择器: 这两种选择器适合于那些应用范围广的一般性样式,要寻找更特定的元素,可以使用ID选择器和类选择器。 通常会使用类型、后代、ID、类等几种选择器的组合。 伪类: 通用选择器: 高级选择器: 2.后代选择器:选择一个元素的所有后代 3.相邻同胞选择器:选择紧接在另一个元素后的元素,而且二者有 阅读全文
posted @ 2017-03-28 17:28 霓裳梦竹 阅读(163) 评论(0) 推荐(0) 编辑
摘要://计算字符串长度 String.prototype.strLen = function() { var len = 0; for (var i = 0; i 255 || this.charCodeAt(i) 255 || this.charCodeAt(i) < 0) return true; else return false; ... 阅读全文
posted @ 2016-11-15 16:00 霓裳梦竹 阅读(288) 评论(0) 推荐(0) 编辑
摘要:白帽SEO:网站标题 关键字 描述 网站内容优化 Robot.txt文件 网站地图 增加外链引用 网站结构布局优化:扁平化结构 控制首页链接数量:中小网站100以内,页面导航、底部导航、锚文字链接等 扁平化的目录层次:小蜘蛛跳转3次可以到达网站内任何一个内页,网站的设计主页、栏目、内容页,不要用纵线 阅读全文
posted @ 2016-11-15 13:29 霓裳梦竹 阅读(163) 评论(0) 推荐(0) 编辑
摘要:1 var eventUtil={ 2 // 添加句柄 3 addHandler:function(element,type,handler){ 4 if(element.addEventListener){ 5 element.addEventListener(type... 阅读全文
posted @ 2016-11-09 21:08 霓裳梦竹 阅读(1055) 评论(0) 推荐(0) 编辑

点击右上角即可分享
微信分享提示