HTML
裴嘉靖
学而不思则罔 思而不学则殆
展开
-
input type=number 输入11位手机号写法
<input type="number" oninput="if(value.length>11)value=value.slice(0,11)" name="mobile" id="mobile" value="" maxlength="11" required />原创 2020-10-14 16:26:10 · 5389 阅读 · 0 评论 -
Vue添加书籍
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>图书管理系统</title> <script src="js/jquery.js" type="text/javascript" charset="utf-8"></scrip...原创 2019-10-29 18:54:24 · 938 阅读 · 0 评论 -
Vue自适应完美购物车
<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>购物车</title> <link rel="stylesheet" type="text/css" href="css/bootstrap.css"/> <script ...原创 2019-10-29 18:50:03 · 222 阅读 · 0 评论 -
Vue之组件(复用性、props、单向数据流)
组件组织通常一个应用会以一棵嵌套的组件树的形式来组织。–VUE:组件化、数据驱动例如,可能会有页头、侧边栏、内容区等组件,每个组件又包含了其它的像导航链接、标题之类的组件。为了能在模板中使用,这些组件必须先注册以便 Vue 能够识别。为了能在模板中使用,这些组件必须先注册以便 Vue 能够识别。组件复用性可以将组件进行任意次数的复用,例如,利用组件定义一个超级链接,在项目中多次...原创 2019-10-22 20:06:54 · 482 阅读 · 0 评论 -
静态补充CSS类型转换
块级元素常用的块级block标签:<hn>...</hn> 标题标签<hr> 水平分割线<p>...</p> 段落<ul>...</ul> 无序列表<ol>...</ol> 有序列表<dl>...</dl> 定义列表<table&g...原创 2019-10-21 19:43:03 · 87 阅读 · 0 评论 -
Vue之表单与v-model
Vue之表单与v-model小编分为五个部分:如下(1)v-model基本用法(2)单选框/按钮(3)复选框/多选按钮(4)下拉选择列表(5)表单输入绑定修饰符v-model基本用法表单控件在实际业务较为常见,比如单选、多选、下拉选择、输入框等,用它们可以完成数据的录入、校0验、提交等。 Vue 提供了 v-model指令,用于在表单类元素上双向绑定数据。例如在输入框上使用时,输...原创 2019-10-15 20:19:08 · 3388 阅读 · 0 评论 -
Vue Array数组操作(变异更新、替换)
今天小编写一下Array数组操作(变异更新、替换)来个v-for和key小补充,方便了解接下来的课程循环指令v-for补充:使用v-for更新已渲染的元素列表时,默认用就地复用策略;列表数据修改的时候,他会根据key值去判断某个值是否修改,如果修改,则重新渲染这一项,否则复用之前的元素;我们在使用的使用经常会使用index(即数组的下标)来作为key,但其实这是不推荐的一种使用方法;最...原创 2019-10-15 19:51:31 · 39952 阅读 · 4 评论 -
vue的基础入门简介和数据绑定
Vue.js 是目前最火的一个前端框架,是前端的主流框架之一,和Angular.js、React.js 一起,并成为前端三大主流框架!Vue的使用安装?Vue.js是一个渐进式的js框架,前期的基础学习阶段,引入vue先用最简单的方式—通过script加载CDN文件,或者下载后通过script标签引入。(1)CDN版本:①开发环境版本,包含了完整的警告和调试模式③注意:在开发环境...原创 2019-10-09 18:52:10 · 549 阅读 · 0 评论 -
attr和prop区别
像checkbox,radio和select这样的元素,选中属性对应“checked”和“selected”,这些也属于固有属性,因此需要使用prop方法去操作才能获得正确的结果。<input id="chke1" type="checkbox" />记住密码<input id="chke2" type="checkbox" checked="checked" />记住...原创 2019-09-10 17:04:46 · 142 阅读 · 0 评论 -
inpute 单选
<input type="radio" name="sex" value="先生" checked='checked'/>先生<input type="radio" name="sex" value="女士"/>女士原创 2019-09-10 16:12:32 · 1115 阅读 · 2 评论 -
判断checkbox是不是选中状态
自己总忘,记下来比较好var dianji = document.getElementsByClassName("dianji")[0]; dianji.onclick = function(){ if(this.value==true){ console.log("选中") }else{ console.log("未选中") } }...原创 2019-09-10 16:11:08 · 594 阅读 · 0 评论 -
移动端 rem用法
rem是如何实现布局的?rem是相对于根元素,这样就意味着,我们只需要在根元素确定一个px字号,则可以来算出元素的宽高。本文讲的是如何使用rem实现自适应。rem是什么?说到rem自然就会想到em,我们知道em是相对于父元素的字体大小的单位,那么rem则是相对于根元素也就是元素的字体大小的单位。上面说过rem是通过根元素进行适配的,网页中的根元素指的是html我们通过设置html的字体大小...原创 2019-09-03 18:57:06 · 449 阅读 · 0 评论 -
纯css手风琴
漂亮手风琴<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <style type="text/css"> .accordian{ width:850px; margin:100px auto;}...原创 2019-08-31 15:18:39 · 100 阅读 · 0 评论 -
纯css选项卡
css选项卡<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>纯css选项卡</title> <style> *{ padding: 0; margin: 0; } form{ width: 600px...原创 2019-08-31 15:15:25 · 436 阅读 · 0 评论 -
纯css轮播图
代码简单明了。有问题留言小编在这里插入<!DOCTYPE html><html lang="zh"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http...原创 2019-08-31 15:12:16 · 589 阅读 · 0 评论 -
文字雨滴效果
如何使用canvas做出文字雨滴的效果<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>文字雨滴效果</title> <style type="text/css"> *{ margin: 0; padding...原创 2019-08-29 16:14:43 · 230 阅读 · 0 评论