Web
关注
分享
扫一扫
文章平均质量分 75
BlackCarbo
wohenlan,jiuzheyangba
展开
-
Bootstrap框架学习（一）——Bootstrap开发环境
一、Bootstrap开发环境1、下载Bootstrap 使用Webstorm开发环境，加载Bootstrap框架。Bootstrap框架包括css、fonts和js三个目录。Bootstrap下载地址：https://getbootstrap.com/。2、简单使用<html><head> <link href="../bootstrap/css/b...转载 2018-06-12 10:32:00 · 2002 阅读 · 0 评论 -
Web前端学习——jQuery知识点（一）
jQuery 语法jQuery 语法是通过选取 HTML 元素，并对选取的元素执行某些操作。基础语法： $(selector).action()美元符号定义 jQuery选择符（selector）"查询"和"查找" HTML 元素jQuery 的 action() 执行对元素的操作实例:$(this).hide() - 隐藏当前元素$("p").hide() - 隐藏所有 <p> 元素...原创 2018-06-15 22:08:21 · 1215 阅读 · 0 评论 -
Web前端学习——jQuery知识点（二）
jQuery 遍历 jQuery 遍历，根据其相对于其他元素的关系来"查找"（或选取）HTML 元素。以某项选择开始，并沿着这个选择移动，直到抵达您期望的元素为止。下图展示了一个家族树。通过 jQuery 遍历，您能够从被选（当前的）元素开始，轻松地在家族树中向上移动（祖先），向下移动（子孙），水平移动（同胞）。这种移动被称为对 DOM 进行遍历。图示解析：<div> 元素是 &...原创 2018-06-15 23:00:21 · 211 阅读 · 0 评论 -
Web——感觉自己会用到又容易忘记的技巧
设置页面内容是html 编码格式是utf-8:<!doctype html><html><head> <meta http-equiv="content-type" content="txt/html; charset=utf-8" /> <title>Document</title>原创 2018-06-21 12:56:50 · 456 阅读 · 0 评论 -
HTML特殊字符表
⇠ 箭头类符号UNICODE符号UNICODEHTMLJSCSSHTMLJSCSS⇠&#8672u21E021E0⇢&#8674u21E221E2⇡&#8673u21E121E1⇣&#8675u21E321E3↞&#8606u219E219E↠&#8608u21A021A0↟&#8607u219F219F↡&#8609u21A121...转载 2018-06-18 10:10:16 · 1476 阅读 · 0 评论 -
HTML5——短语元素样式
h5新增的标签新增元素 说明 video 表示一段视频并提供播放的用户界面 audio 表示音频 canvas 表示位图区域 source 为video和audio提供数据源 track 为video和audio指定字母 svg 定义矢量图 code 代码段 figure 和文档有关的图例 figcapt...转载 2018-06-18 10:11:55 · 783 阅读 · 0 评论 -
网页制作常用网站
检查网页背景是否和文本/链接颜色有较好的对比度WebAIM Color Contrast CheckerPaletton - The Color Scheme DesignerCSS Drive: Image to Colors Palette GeneratorPictaculous - A Color Palette Generator (courtesy of MailChimp)取色配色在...原创 2018-06-21 12:57:06 · 404 阅读 · 0 评论 -
Git学习
Git是目前世界上最先进的分布式版本控制系统。网上看到一个做的比较好的教程https://www.liaoxuefeng.com/wiki/0013739516305929606dd18361248578c67b8067c8c017b000下载直接去官网下在对应系统的Git就好了。创建版本库： 首先，选择一个合适的地方，创建一个空目录：$ mkdir learngit ...转载 2018-07-28 17:33:13 · 155 阅读 · 0 评论 -
JSON和JSONP
JSON是一种基于文本的数据交换方式（不支持跨域），而JSONP是一种跨域数据交互协议。JSON： JSON 指的是 JavaScript 对象表示法（JavaScript Object Notation）。 JSON 语法规则：名称/值对（名称需要引号）。 JSON 值可以是：数字、字符串(" ")、逻辑、数组([ ])、对象({ })、null。 ...转载 2018-08-01 16:00:39 · 287 阅读 · 0 评论 -
前端样式书写规范
一、善用css缩写规则1.边距（4边）：1px 2px 3px 4px (上、右、下、左)1px 2px 3px（省略 左等于右）1px 2px (省略 上等于下)1px（四边都相同）2.缩写（border）特定样式：border:1px solid #ffffff;/*粗细 样式 颜色*/border-width:0 1px 2px 3px;/*上...转载 2019-06-24 09:43:52 · 1607 阅读 · 0 评论 -
Vue项目跨域问题解决
Vue项目跨域问题解决产生原因proxyTable代理跨域本人目前接触的是基于vue-cli、elementUI的前端项目，在前后端联调时遇到过跨域问题。网上找答案，然后解决问题。这里分享一下我用的方法。产生原因跨域产生的原因就是浏览器基于同源策略对跨域访问进行了限制。浏览器限制跨域，但是服务端不限制，因此可以让本地服务端代理跨域访问。proxyTable代理跨域在vue的工程目录下的c...原创 2019-06-24 10:26:49 · 2350 阅读 · 0 评论 -
Vue组件间数据共享
在一些 Vue 前端项目中，一个页面可以看作是由一些子组件拼装成的。但经常一些数据在多个组件中都要用到，并且要保证数据的实时更新。因此需要解决数据在各个组件间共享。常规思路有两个，一个是设置全局变量，另一个是进行变量传递和监听。使用 VuexVuex 可以帮助我们管理共享状态，并附带了更多的概念和框架。这需要对短期和长期效益进行权衡。看官方文档。组件间数据传递最基本的是父-子组件数据传...原创 2019-06-24 11:32:34 · 4572 阅读 · 2 评论 -
Web前端学习———CSS知识点
CSS 指层叠样式表 (Cascading Style Sheets)CSS 规则由两个主要的部分构成：选择器，以及一条或多条声明:选择器通常是您需要改变样式的 HTML 元素。每条声明由一个属性和一个值组成。属性（property）是您希望设置的样式属性（style attribute）。每个属性有一个值。属性和值被冒号分开。CSS声明总是以分号(;)结束，声明组以大括号({})括起来:id 选...原创 2018-06-15 14:34:25 · 798 阅读 · 0 评论 -
Bootstrap框架学习（二）——Bootstrap脚手架
二、Bootstrap脚手架1、Bootstrap全局样式 设置body的全局样式： body{ font-family:@font-family-base; <!-- 文字样式 --> font-size:@font-size-base; <!-- 文字大小 --> line-height:@line-height-base; <!--...转载 2018-06-12 10:31:17 · 1829 阅读 · 0 评论 -
Bootstrap框架学习（三）——Bootstrap样式设计之排版
三、Bootstrap样式设计1、Bootstrap排版 Bootstrap排版主要包括标题、强调、缩略语、地址、引用和列表等元素。 标题 在HTML 中所有的标题标签（从<h1>到<h6>）都可以使用标题样式。另外，从Bootstrap 3 还提供了.h1到.h6类，为的是给内联（inline）属性的文本赋予标题的样式。在标题内还可以包含<...转载 2018-06-12 11:51:57 · 656 阅读 · 0 评论 -
Bootstrap框架学习（三）——Bootstrap样式设计之表格
三、Bootstrap样式设计2、Bootstrap表格转载 2018-06-12 14:23:37 · 926 阅读 · 0 评论 -
Bootstrap框架学习（三）——Bootstrap样式设计之按钮与图片
三、Bootstrap样式设计3、Bootstrap按钮Bootstrap 按钮本章将通过实例讲解如何使用 Bootstrap 按钮。任何带有 class .btn 的元素都会继承圆角灰色按钮的默认外观。但是 Bootstrap 提供了一些选项来定义按钮的样式，具体如下表所示：以下样式可用于<a>, <button>, 或 <input> 元素上：类描述实例.b...转载 2018-06-12 14:40:24 · 1607 阅读 · 0 评论 -
Bootstrap框架学习(四）——Bootstrap组件设计之下拉菜单与按钮
四、Bootstrap组件设计1、Bootstrap下拉菜单 Bootstrap下拉菜单组建，主要包括标签、对齐方式、禁用和子菜单等方面的内容。 标签 下拉菜单是可以用于展示可切换、有关联的菜单链接。创建下拉菜单需要使用列表标签<ul>-<li>，且下拉菜单的触发器和整个下拉菜单都需要包裹在.dropdowm类中，又或者声明为“position：relat...转载 2018-06-12 19:35:46 · 3994 阅读 · 0 评论 -
Bootstrap框架学习(四）——Bootstrap组件设计之按钮组
四、Bootstrap组件设计2、Bootstrap按钮组 Bootstrap按钮组，主要包括基本按钮组、工具栏按钮组和垂直按钮组等方面内容。 基本按钮组 基本按钮组就是将一组按钮放在同一个.btn-group类按钮组容器中。 <div class="container"><section id="global"> <div ...转载 2018-06-12 19:56:04 · 605 阅读 · 0 评论 -
Bootstrap框架学习(四）——Bootstrap组件设计之导航
四、Bootstrap组件设计3、Bootstrap导航 Bootstrap框架的导航组件，均使用.nav类来实现。 默认标签导航 默认标签导航是基于<ul><li>标签组并应用.nav-tabs类设计而成的。<section id="global"> <div class="page-header"> ...转载 2018-06-12 20:48:16 · 2250 阅读 · 0 评论 -
Bootstrap框架学习(四）——Bootstrap组件设计之分页、标签与徽章、进度条、字体
四、Bootstrap组件设计4、Bootstrap分页 在Bootstrap框架中使用.pagination类来实现分页，答题可分为标准分页方式和翻页分页方式两种。 标准分页方式 Bootstrap框架中标准分页方式比较适合App应用搜索结果的展示。通过.pagination类定义一个标准分页组件。 <div class="container"><...转载 2018-06-12 21:23:12 · 851 阅读 · 0 评论 -
Bootstrap框架学习(五）——Bootstrap插件设计之模态对话框
五、Bootstrap插件设计 Bootstrap JavaScript插件包括引入方式、data属性及事件等方面内容。在Bootstrap框架下，JS插件可以单个引入（使用Bootstrap框架提供的单个模块的JS文件），也可以一次性全部引入（使用bootstrap.js或压缩坂的bootstrap.min.js）。 需要注意： 建议使用压缩版的JS文件（bootstr...转载 2018-06-13 14:59:26 · 576 阅读 · 0 评论 -
Bootstrap框架学习(五）——Bootstrap插件设计之下拉菜单、滚动监听、标签页
五、Bootstrap插件设计 2、下拉菜单（Dropdown）插件 Bootstrap框架可以将下拉菜单通过组合的方式加入到任何组件之中，譬如：导航条、标签页等。 <div class="bs-example"> <nav id="navbar-example" class="navbar navbar-default navbar-stati...转载 2018-06-13 15:36:06 · 628 阅读 · 0 评论 -
Bootstrap框架学习(五）——Bootstrap插件设计之提示框
五、Bootstrap插件设计 5、Bootstrap提示框 Bootstrap提示框包括工具提示框、警告框和弹出框三大类。 工具提示框（Tooltip）插件 Tooltip插件是受 Jason Frame 写的 jQuery.tipsy 的启发。Tooltip）插件做了很多改进，例如不需要依赖图像，而是改用 CSS 实现动画效果，用 data 属性存储标题...转载 2018-06-13 16:07:54 · 565 阅读 · 0 评论 -
Bootstrap框架学习(五）——Bootstrap插件设计之按钮
五、Bootstrap插件设计6、Bootstrap按钮（Button）插件 Bootstrap框架按钮，包括状态按钮、复选按钮和单选按钮等。 状态按钮 点击后按钮状态将会自动改变，通过JS代码可以实现按钮状态的重置。<div class="bs-example"> <button type="button" id="loading-exampl...转载 2018-06-13 16:26:09 · 339 阅读 · 0 评论 -
Bootstrap框架学习(五）——Bootstrap插件设计之折叠与轮播
五、Bootstrap插件设计7、Bootstrap 折叠（Collapse）插件 折叠（Collapse）插件可以很容易地让页面区域折叠起来。无论您用它来创建折叠导航还是内容面板，它都允许很多内容选项。如果想要单独引用该插件的功能，那么需要引用 collapse.js。同时，也需要在 Bootstrap 版本中引用 Transition（过渡）插件。或者，可以引用 bootstrap.j...转载 2018-06-13 16:36:14 · 407 阅读 · 0 评论 -
Web特效——简单卡片翻转效果
将网上找到的一个方法进行了修改，实现通过非按钮点击进行卡片左右反转，根据反转次数显示当前面的信息。<!DOCTYPE html><html><head> <meta charset="utf-8"> <title>my</title> <style>原创 2018-06-22 10:21:06 · 3804 阅读 · 0 评论 -
Web前端学习——HTML知识点
HTML 指的是超文本标记语言: HyperText Markup LanguageHTML 网页结构下面是一个可视化的HTML页面结构：<html><head><title>页面标题</title></head><body><h1>这是一个标题</h1><p>原创 2018-06-15 13:02:48 · 447 阅读 · 0 评论 -
Vue项目中子组件样式设置了scoped 属性后一些样式失效问题
Vue项目中子组件样式设置了scoped 属性后一些样式失效问题scoped 属性一些样式失效解决方法scoped 属性当 style 标签有 scoped 属性时，它的 CSS 只作用于当前组件中的元素。<template> <div class="example"> hi <p>scoped</p> </div...原创 2019-06-24 15:57:13 · 4756 阅读 · 0 评论