前端学习
关注
分享
扫一扫
文章平均质量分 72
爱吃红豆的猫
言念君子，温其如玉
展开
-
li标签内使用display：flex 导致li标签失去标号
li标签内使用display：flex 导致li标签失去标号原创 2022-08-29 03:54:42 · 1109 阅读 · 0 评论 -
CSS3新特性
在项目开发中我们采用的CSS3新特性有 2. @Font-face 特性Font-face 可以用来加载字体样式，而且它还能够加载服务器端的字体文件，让客户端显示客户端所没有安装的字体。3. 圆角4. 多列布局 （multi-column layout）5.阴影（Shadow） OPPO官网的阴影特效 http://www.oppo.com/cn/products.html这里 linear 表示线性渐变，从左到右，由蓝色（#2A8BBE）到红色（#FE2原创 2022-06-01 15:53:41 · 314 阅读 · 0 评论 -
html5特性（常用工作总结）
尽管使用，即使浏览器不懂这句话也会按照标准模式去渲染用和来语义化地表示带标题的图片3. 重新定义的已经被重新定义了，现在被用来表示小的排版，如网站底部的版权声明HTML5没有严格的要求属性必须加引号，闭合不闭合，但是建议加上引号和闭合标签如果我们给Input的type设置为email，浏览器就会验证这个输入是否是email类型，当然不能只依赖前端的校验，后端也得有相应的校验这个input属性的意义就是不必通过javascript来做placeholder的效果了使用Local Storage可以永原创 2022-06-01 15:40:38 · 153 阅读 · 0 评论 -
前端查询数组指定元素的个数
1.jquery grep()筛选遍历数组(可以得到反转的数组)// 1.jquery grep()筛选遍历数组(可以得到反转的数组) let array = [1,5,9,3,12,4,48,98,4,75,2,10,11]; let filterArray = $.grep(array,(currentValue) => { return currentValue > 10; }); console.log(`${filterArray}...原创 2022-05-20 15:45:41 · 1509 阅读 · 0 评论 -
手写一个Array.map的实现
今天就来实现一个简单的map方法首先我们来看一下map方法的使用以及具体的参数 var arr = ["a","b","c","d","e"]; arr.map(function(currentValue,index,arr){ console.log("当前元素"+currentValue) console.log("当前索引"+index) console.log("数组对象"+arr) .原创 2021-06-07 19:20:18 · 576 阅读 · 0 评论 -
js原型链的理解
构造函数创建对象function Person() {}var person = new Person();person.name = 'Kevin';console.log(person.name) // Kevin//在这个例子中，Person 就是一个构造函数，我们使用 new 创建了一个实例对象 person。prototype每个函数都有一个 prototype 属性，就是我们经常在各种例子中看到的那个 prototypefunction Person() {.转载 2021-06-07 19:12:26 · 4203 阅读 · 0 评论 -
关于日期时间项目中遇到的情况总结
js获取两个时间段内的所有日期列表function getDiffDate(start, end) { var startTime = getDate(start); var endTime = getDate(end); var dateArr = []; while ((endTime.getTime() - startTime.getTime()) > 0) { var year = startTime.getFullYear();原创 2021-05-28 17:09:37 · 234 阅读 · 0 评论 -
let、var与const
var 与 let 区别es6 刚流行那会，我只知道 var 即将退出历史舞台，取而代之的是 let 和 const，却不知道 var 有什么缺陷，为什么会被取代。今天在 Youtube 上看到一段视频，解答了我的疑惑。但对于对于 IOS 兼容、遗留老代码里仍使用 var 不在交流范围内。先看用到 var 的一段代码。function doSomething () { for (var i = 0; i < 5; i++) { console.log(i)原创 2021-03-23 14:06:14 · 179 阅读 · 0 评论 -
2021-02-22
jQuery语法通过 jQuery，您可以选取（查询，query） HTML 元素，并对它们执行"操作"（actions）。jQuery 语法jQuery 语法是通过选取 HTML 元素，并对选取的元素执行某些操作。基础语法：$(selector).action()美元符号定义 jQuery 选择符（selector）"查询"和"查找" HTML 元素 jQuery 的 action() 执行对元素的操作实例: $(this).hide() - 隐藏当前元素 $..原创 2021-02-22 10:43:09 · 136 阅读 · 0 评论 -
JavaScript_DOM节点
认识DOM文档对象模型DOM（Document Object Model）定义访问和处理HTML文档的标准方法。DOM将HTML文档呈现为带有元素、属性和文本的树结构（节点树）。先来看看下面代码:将HTML代码分解为DOM节点层次图:HTML文档可以说由节点构成的集合，DOM节点有:1.元素节点：上图中<html>、<body>、<p&...原创 2021-02-22 10:35:05 · 145 阅读 · 0 评论 -
echarts 常用设置
本篇文章记录在工作中使用echars绘图工具所用到的各个功能的配置项，及配置的API简单echarts的使用建议直接去官网查看：https://echarts.apache.org/zh/index.html#categories点击左上角文档有教程和官方的文档与API（中文狂喜）名词解析基本名词名词 描述 chart 是指一个完整的图表，如折线图，饼图等“基本”图表类型或由基本图表组合而成的“混搭”图表，可能包括坐标轴、图例等 axis 直角坐标系中的一个坐标原创 2021-02-22 10:34:01 · 655 阅读 · 0 评论 -
css技巧收藏夹
http://caibaojian.com/30-seconds-of-css/ css动画原创 2018-10-11 12:21:09 · 229 阅读 · 0 评论 -
CSS专业开发技巧：常见的开发技巧
使用CSS复位CSS复位可以在不同的浏览器上保持一致的样式风格。您可以使用CSS reset 库Normalize等，也可以使用一个更简化的复位方法：* { box-sizing: border-box; margin: 0; padding: 0;}现在元素的 margin 和 padding 已为0，box-sizing可以管理您的CSS盒模型布局。注意：如果你...原创 2018-09-10 09:27:39 · 239 阅读 · 0 评论 -
HTML+CSS基础学习过程中遇到的问题
不同的标签有什么特点？它们的使用场景是什么？一、 概述 HTML（Hyper Text Markup Language ）作为一种标记语言，网页所有的内容均书写在标签内部，标签是组成Html页面的基本元素，因此对标签特性的理解在HTML的学习过程中比较重要。二、基本分类 HTML中的标签从闭合的角度可以分为闭合标签和空标签。而HTML中大部分标签都是闭合...原创 2018-08-20 19:14:07 · 1138 阅读 · 0 评论 -
HTML与CSS学习记录（7）
盒模型代码简写还记得在讲盒模型时外边距(margin)、内边距(padding)和边框(border)设置上下左右四个方向的边距是按照顺时针方向设置的：上右下左。具体应用在margin和padding的例子如下：margin:10px 15px 12px 14px;/*上设置为10px、右设置为15px、下设置为12px、左设置为14px*/通常有下面三种缩写方法:1、如果...原创 2018-08-20 18:54:27 · 440 阅读 · 0 评论 -
深入学习CSS3学习记录
初识CSS3什么是CSS3？CSS3是CSS2的升级版本，3只是版本号，它在CSS2.1的基础上增加了很多强大的新功能。 目前主流浏览器chrome、safari、firefox、opera、甚至360都已经支持了CSS3大部分功能了，IE10以后也开始全面支持CSS3了。在编写CSS3样式时，不同的浏览器可能需要不同的前缀。它表示该CSS属性或规则尚未成为W3C标准的一部分，是浏览...原创 2018-08-27 10:01:38 · 639 阅读 · 0 评论 -
HTML与CSS学习记录（6）————CSS布局模型
css布局模型清楚了CSS 盒模型的基本概念、 盒模型类型， 我们就可以深入探讨网页布局的基本模型了。布局模型与盒模型一样都是 CSS 最基本、 最核心的概念。 但布局模型是建立在盒模型基础之上，又不同于我们常说的 CSS 布局样式或 CSS 布局模板。如果说布局模型是本，那么 CSS 布局模板就是末了，是外在的表现形式。 CSS包含3种基本的布局模型，用英文概括为：Flow、Layer 和...原创 2018-08-17 06:14:19 · 234 阅读 · 0 评论 -
HTML中id、name、class 区别
转载自一个大神的博客用于自己学习https://blog.youkuaiyun.com/ithomer/article/details/8080912原文：HTML 中 id与name 区别一个name可以同时对应多个控件，比如checkbox和radio而id必须是全文档中唯一的 id的用途 1） id是HTML元素的Identity，主要是在客户端脚本里用。2） labe...原创 2018-08-12 20:54:11 · 275 阅读 · 0 评论 -
HTML与CSS学习记录（2）
认识<hr>标签，添加水平横线语法：html4.01版本 <hr>xhtml1.0版本 <hr />注意：1. <hr />标签和<br />标签一样也是一个空标签，所以只有一个开始标签，没有结束标签。2. <hr />标签的在浏览器中的默认样式线条比较粗，颜色为灰色，可能有些人觉得这种样式不美观，没有...原创 2018-08-12 21:02:02 · 628 阅读 · 0 评论 -
npm scripts学习指南
Node 开发离不开 npm，而脚本功能是 npm 最强大、最常用的功能之一。本文介绍如何使用 npm 脚本（npm scripts）。一、什么是 npm 脚本？npm 允许在package.json文件里面，使用scripts字段定义脚本命令。{ // ... "scripts": { "build": "node build.js" }}...原创 2018-08-08 16:15:57 · 169 阅读 · 0 评论 -
什么是npm及热加载服务
热加载（hot reload）服务热加载服务使用 budo 集成。budo 是一个 browserify 开发服务器模块，专注于增量热更新加载，LiveReload 集成（包括 CSS 注入）和其他用于快速原型设计的高级功能。npm是什么 程序员自古以来就有社区文化：社区的意思是：拥有共同职业或兴趣的人们，自发组织在一起，通过分享信息和资源进行合作。虚拟社区的参与者经常会在...原创 2018-08-08 01:04:15 · 1759 阅读 · 0 评论 -
Git 中文详细安装教程
本文章只作学习笔记使用，相关问题及其他请去原文档。https://blog.youkuaiyun.com/sishen47k/article/details/80211002Git Setup 2.17.0Git 中文安装教程Author : 谢宗南https://creativecommons.org/licenses/by-nc-nd/4.0/deed.zh GitHub原文...原创 2018-08-07 21:41:17 · 1060 阅读 · 0 评论 -
关于cmder的安装与初次使用常用设置
简介与 Windows 自带的 cmd 和 PowerShell 相比，cmder 具有友好的界面和更加丰富的功能。安装下载地址：http://cmder.net/解压后，得到 cmder1.3.2 文件夹。将其拷贝到 D:\Program Files\ 目录下。然后，将 Cmder.exe 所在的目录（D:\Program Files\cmder1.3.2），添加至 Wind...原创 2018-08-07 21:26:51 · 2202 阅读 · 0 评论 -
学会用好 Visual Studio Code
转载自http://www.nshen.net/article/2015-11-20/vscode/Visual Studio Code是个牛逼的编辑器，启动非常快，完全可以用来代替其他文本文件编辑工具。又可以用来做开发，支持各种语言，相比其他IDE，轻量级完全可配置还集成Git感觉非常的适合前端开发，是微软亲生的想必TypeScript会支持的非常好。 所以我仔细研究了一下文档未来可能会作为...原创 2018-08-07 21:32:07 · 563 阅读 · 0 评论 -
Visual Studio Code安装和配置
转载https://blog.youkuaiyun.com/zhaojia92/article/details/53862840本文章只作为学习笔记使用。Visual Studio Code编辑器在Windows上安装比较简单，直接setup.exe。安装好后首次启动配置插件，插件配置必须联网，从网上下载。如下图点击左侧扩展：首次安装会推荐一些常用插件。如果没有显示推荐的插件，点击左侧右上角的...原创 2018-08-07 21:35:05 · 15934 阅读 · 0 评论 -
npm Scripts 入门学习（2）
近来直接使用node package提供的命令行界面的情绪持续高涨，反之，人们对通过运行任务从而屏蔽抽象功能的热情逐渐降温。在一定程度是，你无论如何都要使用npm，而同时npm提供了脚本功能，为什么不用呢？但是我们使用npm的脚本功能的原因有很多。Damon会帮我们理解这样做的原因，并确切的告诉我们如何通过这种方式来完成前端构建过程中的大部分重要任务。使用Gulp，再之前是 Grunt。 Gulp...原创 2018-08-08 16:39:54 · 299 阅读 · 0 评论 -
HTML与CSS学习记录（3）————CSS样式基本知识
认识CSS样式CSS全称为“层叠样式表 (Cascading Style Sheets)”，它主要是用于定义HTML内容在浏览器内的显示样式，如文字大小、颜色、字体加粗等。如下列代码：p{ font-size:12px;/*设置文字字号*/ color:red;/*设置文字颜色*/ font-weight:bold;/*设置字体加粗*/使用CSS样式的一个好处是通过...原创 2018-08-16 21:23:20 · 327 阅读 · 0 评论 -
HTML与CSS学习记录（4）————CSS选择器、继承、层叠和特殊性
什么是选择器？每一条css样式声明（定义）由两部分组成，形式如下：选择器{ 样式;}在{}之前的部分就是“选择器”，“选择器”指明了{}中的“样式”的作用对象，也就是“样式”作用于网页中的哪些元素。比如代码中的“body”就是选择器。<title>选择器</title><style type="text/css">body{ ...原创 2018-08-16 21:50:26 · 366 阅读 · 0 评论 -
HTML与CSS学习记录（5）————排版
文字排版--字体我们可以使用css样式为网页中的文字设置字体、字号、颜色等样式属性。下面我们来看一个例子，下面代码实现：为网页中的文字设置字体为宋体。body{ font-family:"Microsoft Yahei";}body{font-family:"宋体";}这里注意不要设置不常用的字体，因为如果用户本地电脑上如果没有安装你设置的字体，就会显示浏览器默认的...原创 2018-08-16 22:40:50 · 681 阅读 · 0 评论 -
HTML与CSS学习记录（6）————CSS盒模型
元素分类在讲解CSS布局之前，我们需要提前知道一些知识，在CSS中，html中的标签元素大体被分为三种不同的类型：块状元素、内联元素(又叫行内元素)和内联块状元素。常用的块状元素有：<div>、<p>、<h1>...<h6>、<ol>、<ul>、<dl>、<table>原创 2018-08-17 05:21:36 · 172 阅读 · 0 评论 -
HTML与CSS学习记录(1)
大家一起学习一起讨论一起进步学习web前端开发基础技术需要掌握：HTML、CSS、JavaScript语言。下面我们就来了解下这三门技术都是用来实现什么的：1. HTML是网页内容的载体。内容就是网页制作者放在页面上想要让用户浏览的信息，可以包含文字、图片、视频等。2. CSS样式是表现。就像网页的外衣。比如，标题字体、颜色变化，或为标题加入背景图片、边框等。所有这些用来改变内容外观的...原创 2018-08-09 20:38:58 · 332 阅读 · 0 评论