前端
关注
分享
扫一扫
Linda L
这个作者很懒，什么都没留下…
展开
-
Vue集成Markdown插件
目前发现的Markdown插件有vue-markdown和mavon-editor,这里选择mavon-editor 引入依赖: 带Markdown编辑器的组件<template> <div id="editor"> <mavon-editor style="height: 100%"></mavon-editor> </div></template><script> i原创 2017-09-05 15:48:56 · 5655 阅读 · 1 评论 -
Webpack、Vue、Element UI基础工程构建
npm安装webpack,用于将工程的js、css、png等文件打包 安装vue-cli脚手架,如果没装成功,可能npm版本太低 跑完用vue -V查看Vue是否成功全局引入，注意这里的用大写的V 有了这两个就可以构建基本工程，这里将工程命名为lindl-blog-web 将下载好的工程导入idea,如果本地启动的服务太多，避免冲突，可以修改config下的index.js修原创 2017-07-23 17:50:24 · 719 阅读 · 0 评论 -
谷歌调试axios异步请求XMLHttpRequest cannot load http问题解决
谷歌浏览器调试axios异步请求出现XMLHttpRequest cannot load http… 首先需要关闭谷歌浏览器的所有窗口 右击谷歌浏览器图标——>属性。弹出属性对话框。在目标栏最后添加 –args –disable-web-security –user-data-dir 配完重启chrome原创 2017-08-31 20:19:59 · 4362 阅读 · 1 评论 -
Vue文件配置全局变量
在vue文件里配置所需的全局变量，然后通过export暴露出去。 如Global.vue<script type="text/javascript"> const serverPath="http://127.0.0.1:8080"; export default{ serverPath }</script>在main.js引入,将global接口放到prototype，这原创 2017-08-31 20:26:22 · 11181 阅读 · 0 评论 -
Vue结合Element UI实现导航的router属性 expected boolean,got string
为了能通过el-menu-item的index实现动态路由跳转,得将el-menu的router设为true,默认是false 代码实现是这样的 但是每次通过npm启动完访问控制台都会报错。 Vue结合Element UI实现导航,在router属性处出现 expected boolean,got string 后来发现另一种写法是ok的:原创 2017-08-24 17:24:14 · 7623 阅读 · 0 评论 -
Ionic动态加载页面
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link href="lib/ionic/css/ionic.css" rel="stylesheet"> <script src="lib/ionic/js/ionic.bundle.js"></sc原创 2016-09-16 17:43:33 · 5144 阅读 · 0 评论 -
Ionic实现侧边栏
angularJs脚本app.js用于为列表填充数据/** * Created by lin on 2016/9/15. */angular.module('todo', ['ionic']) .controller('TodoCtrl', function($scope) { $scope.tasks = [ { title: 'aaaa' },原创 2016-09-15 19:55:13 · 2841 阅读 · 0 评论 -
搭建Ionic应用框架
Ionic的安装依赖于npm。用npm全局装好cordova和ionic。这个很奇怪，本地装cordova和ionic没问题，但在cmd查不到相关版本信息，说明没全局安装成功。笔者亲试了下，先装express,然后再装这两个，没越墙，网速可能有点卡，最后还是成功了，不行就找淘宝镜像。全局装好ionic是可以在任意目录下利用命令生成ionic工程代码框架的，用的时候再将生成的相关文件引入project原创 2016-09-15 18:45:58 · 622 阅读 · 0 评论 -
Ionic实现左侧侧边栏新建项目
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <link href="lib/ionic/css/ionic.css" rel="stylesheet"> <script src="lib/ionic/js/ionic.bundle.js"></sc原创 2016-09-16 18:18:25 · 1386 阅读 · 0 评论 -
属性选择器
属性选择器可以根据元素的属性及属性值来选择元素。 在CSS3中，增加了3个属性选择器，使得属性选择器有了通配符的概念。[attr*=val]属性选择器 如果元素用attr表示属性，它的属性值中包含val指定的字符，则该元素使用这个样式 [id*="sh"]{ font-family:"MS Serif","New York",serif; color:#76ee00;原创 2015-06-09 17:10:26 · 1029 阅读 · 0 评论 -
CSS里的单位
CSS中预设了16种颜色以及16种颜色的衍生色，这16种颜色是CSS规范推荐的，而且一些主流的浏览器都能够识别，如下表所示： 十六进制颜色是最常用的定义方式。它的基本格式为#RRGGBB,R、G、B分别代表红绿蓝。也可以用RGB(R,G,B)设置颜色，参数用0～255的十进制数表示 为保证页面元素能够在浏览器中按照合理布局完全显示，需要设置各个元素的间距以及元素本身的边框尺寸等，这些属性值原创 2015-06-09 16:34:09 · 778 阅读 · 0 评论 -
结构性伪类选择器
结构性伪类选择器的公共特征是允许开发者根据文档结构来指定元素的样式。root选择器 将样式捆绑到页面的根元素中。所谓根元素是指位于文档结构中最顶层的元素。在HTML页面中，就是指包含整个页面的部分如可用以下片段将整个网页的背景设为黄色，将网页中的body元素背景设为红色。 :root{background-color:yellow;} body{background-原创 2015-06-10 16:59:22 · 2594 阅读 · 0 评论 -
盒相关样式
CSS中的盒状模型用于描述一个为HTML元素形成的矩形盒状。CSS盒状模型还涉及为各个元素调整外边距、边框、内边距和内容的具体操作。原创 2015-06-14 09:01:14 · 1148 阅读 · 2 评论 -
伪类选择器和伪元素
伪类选择器是使用在a（锚）元素上的几种选择器，它们的使用方法如下：a:link{color:#ff0000;text-decoration:none}a:visited{color:#00ff00;text-decoration:none}a:hover{color:#ff00ff;text-decoration:underline}a:link{color:#0000ff;text-deco原创 2015-06-10 15:17:18 · 1409 阅读 · 1 评论 -
UI元素状态伪类选择器
E:hover 用于指定当鼠标指针移动到元素上面时元素所使用的样式；E:action 用于指定元素被激活（鼠标在元素上按下还没有松开）时所使用的样式；E:focus 用于指定元素获得光标焦点时所使用的样式，主要是在文本框空间获得焦点并进行文字输入时使用的样式；E:enable 设置该元素处于可用状态的样式；E:disabled 设置该元素处于不可用状态时的样式；E原创 2015-06-11 11:03:32 · 2994 阅读 · 0 评论 -
CSS3之文本相关样式
结束一个阶段的学业用一个词“百感交集”来形容还真合适。今早本想去凑个人头拍几张照的...参加完所谓的毕业典礼回来后就什么都不想干了，没为什么!天气太热，什么都不想吃，直接把午饭延到下午三点多。 不同阶段的人生经历和见识会导致不同的人生态度，想要活得轻松，就不要计较太多。看不开，就躲开。 不管心情好坏，东西还是得学的。在一个依无所依的城市，依旧个性太强，不愿内化的人，只能靠实力保护自己。不废话了，灌水!原创 2015-06-12 20:36:39 · 1316 阅读 · 0 评论 -
样式属性
字体@font-face ：{属性: 取值;}font-family： 设置文本的字体名称。 font-style： 设置文本样式。 font-variant： 设置文本是否大小写。 font-weight： 设置文本的粗细。 font-stretch： 设置文本是否横向的拉伸变形。 font-size： 设置文本字体大小。 src： 设置自定义字体的相对路原创 2015-04-17 08:34:27 · 957 阅读 · 0 评论 -
CSS3之利用选择器和content属性在页面中插入内容
使用before选择器或after选择器的counter属性，不但可以在编号中追回文字和设置样式，还可以为编号设置编号类型。指定编号类型可以使用list-style-type属性，常用的编号种类介绍如下： p:before { content: '你好,'; color: white; background-color: orange; f原创 2015-06-12 13:12:50 · 3904 阅读 · 0 评论 -
设置CSS的几种方式
内联样式表 meta http-equiv="content-type" content="text/css" />嵌入样式表head> style type="text/css"> ... --> style>head>外部样式表DOCTYPE html>html>head>原创 2015-04-16 21:19:18 · 1237 阅读 · 0 评论 -
背景、边框样式及变形处理
background-clip属性用于指定背景的显示范围。属性值如下：background-origin属性用于指定在绘制背景时，从边框的左上角开始或者从内容的左上角开始。属性值如下：background-size用于指定背景图像的尺寸。属性值如下：background-break属性用于指定内联元素背景图像进行平铺时的循环方式。循环方式介绍如下：在原创 2015-06-16 13:03:35 · 1423 阅读 · 0 评论 -
Ajax入门学习
AJAX = Asynchronous JavaScript and XML（异步的 JavaScript 和 XML）。AJAX 是与服务器交换数据并更新部分网页的艺术，在不重新加载整个页面的情况下。在 2005 年，Google 通过其 Google Suggest 使 AJAX 变得流行起来。Google Suggest 使用 AJAX 创造出动态性极强的 web 界面：当您在谷原创 2015-10-26 16:37:17 · 583 阅读 · 0 评论 -
运算符
JScript 具有全范围的运算符,包括算术、逻辑、位以及赋值运算符。此外还有其他一些运算符。运算符优先极JScript 中的运算符是按照一个特定的顺序来求值的。这个顺序就是运算符的优先级。下表按从最高到最低的优先级列出了这些运算符。处于同一行中的运算符按从左至右的顺序求值。 圆括号可用来改变求值顺序。圆括号中的表达式应在其用于语句的其余部分之前全部被求值。原创 2015-04-17 12:35:34 · 888 阅读 · 0 评论 -
DOM之Window对象
Window 对象表示一个浏览器窗口或一个框架。在客户端 JavaScript 中，Window 对象是全局对象，所有的表达式都在当前的环境中计算。也就是说，要引用当前窗口根本不需要特殊的语法，可以把那个窗口的属性作为全局变量来使用。例如，可以只写document，而不必写 window.document。同样，可以把当前窗口对象的方法当作函数来使用，如只写 alert()，而不必写 Wi原创 2015-04-17 19:01:30 · 1211 阅读 · 0 评论 -
JavaScript学习方法
待续原创 2015-04-21 10:36:47 · 1218 阅读 · 0 评论 -
DOM之Document对象
Document 对象代表整个 HTML 文档，可用来访问页面中的所有元素。Document 对象是 Window 对象的一个部分，可通过 window.document 属性来访问。...cookie 是存储于访问者的计算机中的变量。每当同一台计算机通过浏览器请求某个页面时，就会发送这个 cookie。你可以使用 JavaScript 来创建和取回 cookie 的值。名字 cookie 当访问者首次访问页面时，他或她也许会填写他/她们的名字。名字会存储于 cookie 中。当访问者再次访问网站原创 2015-04-17 22:09:29 · 948 阅读 · 0 评论 -
DOM之Form对象（一）
当用户点击递交按钮或点击单行文本输入框按下回车键后，表单递交到3w服务器之前就会发生onsubmit()事件，典型用法就是检查form表单收到数据的合法性和完整性,防止将不正确的数据传递给3w服务器 Form 对象的 onsubmit 属性指定了一个事件句柄函数。当用户单击了表单中的 Reset 按钮而提交一个重置时，就会调用这个事件句柄函数。注意，当调用方法Form.submi原创 2015-04-18 21:07:46 · 1057 阅读 · 0 评论 -
JavaScript简单了解
JScript 是 Microsoft 公司对 ECMA 262 语言规范的一种实现。JScript 完全实现了该语言规范，并且提供了一些利用 Microsoft Internet Explorer 的功能的增强特性。脚本语言的出现，弥补了HTML的不足。JScript 是一种解释型的、基于对象的脚本语言。尽管与诸如 C++ 和 Java 这样成熟的面向对象的语言相比，JScript 的功能要原创 2015-04-17 10:29:15 · 1028 阅读 · 0 评论 -
DHTML之DOM
JavaScript将浏览器本身、网页文档、以及网页文档中的HTML元素等都用相应的内置对象来表示，这些对象及对象之间的层次关系统称为DOM(Document Object Model,文档对象模型)通过 JavaScript，您可以重构整个 HTML 文档。您可以添加、移除、改变或重排页面上的项目。要改变页面的某个东西，JavaScript 就需要对 HTML 文档中所有元素进行访问的入原创 2015-04-17 13:52:56 · 1049 阅读 · 0 评论 -
DOM之Event对象
Event 对象代表事件的状态，比如事件在其中发生的元素、键盘按键的状态、鼠标的位置、鼠标按钮的状态。事件通常与函数结合使用，函数不会在事件发生前被执行！ 几个实例：哪个鼠标按钮被点击？ functi原创 2015-04-17 19:44:07 · 652 阅读 · 0 评论 -
DHTML之事件处理
在某个事件发生时通过一个事件句柄对某个元素进行某种操作。onmouseover 和 onmouseout在鼠标指针移到并移开一个元素时改变一个元素的颜色<h1 onmouseover="style.color='red'"onmouseout="style.color='black'">请把鼠标移动到文本上onclick把灯点亮。如何当您单击一副图像时改变原创 2015-04-17 18:13:46 · 2172 阅读 · 0 评论 -
DOM之Form对象(二)表单字段元素
HTML的密码域 用户： 密码： 请注意，当您在密码域中键入字符时，浏览器将使用项目符号来代替这些字符。原创 2015-04-20 19:19:26 · 1822 阅读 · 0 评论 -
JavaScript基础杂记
JavaScript对象由花括号分隔。在括号内部，对象的属性以名称和值对的形式 (name : value) 来定义。属性由逗号分隔： var person={firstname:”Bill”, lastname:”Gates”, id:5566}; 对象属性有两种寻址方式： name=person.lastname; name=person[“lastname”]; Undefined原创 2016-06-16 14:30:26 · 436 阅读 · 0 评论 -
Canvas之太阳与地球
太阳与地球 浏览器不支持Canvas元素 var canvas = document.getElementById('canvas'); var context = canvas.getContext('2d'); var time = 0; function draw() { //清原创 2015-04-11 16:15:55 · 1823 阅读 · 0 评论 -
Canvas之太阳系
太阳系 您的浏览器不支持 var cxt = document.getElementById('canvas').getContext('2d');//设置2d环境 //轨道 function drawTrack() { for (var i = 0; i < 8; i++) {原创 2015-04-11 16:18:57 · 1357 阅读 · 0 评论 -
Canvas之时钟
您的浏览器不支持Canvas标签,无法看到时钟 var clock = document.getElementById('clock'); var context = clock.getContext('2d'); //制作绘图环境,设置2d配置环境 function drawClock() { con原创 2015-04-10 10:49:19 · 1027 阅读 · 0 评论 -
用HTML5做的导航条（步骤非常详细）
转载请注明出处：这里写链接内容 首先准备网页背景图片和导航背景图片，放在同一目录下的images文件夹中 编写html文件<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="h原创 2015-05-27 11:37:19 · 124856 阅读 · 13 评论 -
修改输入框placeholder的样式
这里以修改提示文字的颜色为例:::-webkit-input-placeholder { /* WebKit browsers */ color: #EF3B39; } :-moz-placeholder { /* Mozilla Firefox 4 to 18 */ color: #EF3B39; } ::-moz-placeholder { /* Mozilla Firefox 19原创 2016-04-26 18:45:32 · 1026 阅读 · 0 评论 -
HTML5标签
声明是文档中的第一个成分，位于 标签之前。该标签告知浏览器文档所使用的 HTML 规范。 标签没有结束标签！提示： 对大小写不敏感 元素可提供有关页面的元信息（meta-information），比如针对搜索引擎和更新频度的描述和关键词, 标签位于文档的头部，不包含任何内容。 标签的属性定义了与文档相关联的名称/值对。格式标签 标签原创 2015-04-15 13:07:48 · 1280 阅读 · 0 评论 -
HTML5新增主体标签
article标签 表示文档、页面、应用程序或站点中的自包含成分构成的一个页面的一部分，专用于独立地分类或复用。 如一个博客的帖子、一篇文章、一个视频文件等。<!DOCTYPE HTML><html><head><meta charset="utf-8"><title>无标题文档</title></head><body><article> <header> <h1>文章原创 2015-05-28 12:17:30 · 2458 阅读 · 0 评论 -
npm安装Ionic和Cordova
在win上进入node_modules目录，用命令npm install -g cordova ionic –registry=https://registry.npm.taobao.org，正常渠道下载不来东西需要引用淘宝镜像。 安装成功cmd会出现类似以下的文件结构原创 2016-09-07 09:54:23 · 2707 阅读 · 0 评论