前端
文章平均质量分 91
M行者X
这个作者很懒,什么都没留下…
展开
-
web前端技术笔记(十六)bootstrap、表单正则和前端优化
bootstrapbootstrapbootstrap 容器bootstrap 栅格系统栅格响应式布局案例列偏移bootstrap 隐藏类bootstrap 按钮bootstrap 表单bootstrap 导航条导航条案例bootstrap 图片bootstrap 字体图标路径导航bootstrap 下拉菜单巨幕栅格里的rowbootstrap 响应式专题网站实例正则表达式正则默认规则常用正则规则表单验证原理前端性能优化一、代码部署:二、编码bootstrap简单、直观、强悍的前端开发框架,让web开发原创 2021-09-12 17:14:19 · 861 阅读 · 0 评论 -
web前端技术笔记(十五)json、本地存储jqueryUI和移动端JS
jqueryjson配置服务器环境ajax与jsonp同步和异步局部刷新和无刷新同源策略$.ajax使用方法jsonp360联想词案例本地存储jquery 设置cookielocalStoragesessionStorage只弹一次的弹窗 案例jqueryUIjsonjson是 JavaScript Object Notation 的首字母缩写,单词的意思是javascript对象表示法,这里说的json指的是类似于javascript对象的一种数据格式,目前这种数据格式比较流行,逐渐替换掉了传统的xm原创 2021-09-09 19:48:28 · 672 阅读 · 0 评论 -
web前端技术笔记(十四)jQuery节点操作、滚轮事件与函数节流
jQueryjquery元素节点操作todolist 案例滚轮事件与函数节流jquery.mousewheel插件使用函数节流整屏滚动案例幻灯片案例jquery元素节点操作创建节点var $div = $('<div>');var $div2 = $('<div>这是一个div元素</div>');<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8原创 2021-09-08 23:49:01 · 359 阅读 · 0 评论 -
web前端技术笔记(十三)jQuery动画、jquery事件
jQueryjquery动画滑动选项卡案例尺寸相关、滚动事件加入购物车案例菜单吸顶案例jquery属性操作jquery循环手风琴格局案例jquery事件绑定事件的其他方式取消绑定事件事件冒泡什么是事件冒泡事件冒泡的作用阻止事件冒泡阻止默认行为合并阻止操作阻止事件冒泡完成弹窗案例事件委托jquery动画通过animate方法可以设置元素某属性值上的动画,可以设置一个或多个属性值,动画执行完成后会执行一个函数。<!DOCTYPE html><html lang="en"><原创 2021-09-08 01:03:25 · 174 阅读 · 0 评论 -
web前端技术笔记(十二)jQuery介绍、选择器、样式操作
jQueryjquery介绍jquery加载jquery选择器jquery用法思想一对选择集进行过滤选择集转移判断是否选择到了元素jquery样式操作jquery用法思想二操作行间样式操作样式类名绑定click事件获取元素的索引值选项卡案例jquery特殊效果jquery链式调用层级菜单案例jquery介绍jQuery是目前使用最广泛的javascript函数库。据统计,全世界排名前100万的网站,有46%使用jQuery,远远超过其他库。微软公司甚至把jQuery作为他们的官方库。jQuery的版本原创 2021-09-06 00:40:55 · 232 阅读 · 0 评论 -
web前端技术笔记(十一)JavaScript定时器、封闭函数、常用内置对象
JavaScript定时器、封闭函数、常用内置对象定时器时钟倒计时变量作用域封闭函数常用内置对象调试程序的方法定时器定时器在javascript中的作用1、制作动画2、异步操作3、函数缓冲与节流<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <script type="text/javas原创 2021-09-04 16:34:57 · 273 阅读 · 0 评论 -
web前端技术笔记(十)JavaScript函数、条件语句、数组、循环语句
JavaScript函数函数函数定义与执行变量与函数预解析提取行间事件匿名函数网页换肤函数传参函数'return'关键字条件语句if elseswitch语句数组循环语句for循环while循环数组去重获取元素方法二Javascript组成字符串操作方法函数函数就是重复执行的代码片。函数定义与执行<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>D原创 2021-09-02 19:55:09 · 279 阅读 · 1 评论 -
web前端技术笔记(九)JavaScript介绍、变量、操作元素属性
JavaScriptJavaScript介绍变量变量类型变量、函数、属性、函数参数命名规范JavaScript介绍JavaScript是运行在浏览器端的脚步语言,JavaScript主要解决的是前端与用户交互的问题,包括使用交互与数据交互。 JavaScript是浏览器解释执行的,前端脚本语言还有JScript(微软,IE独有),ActionScript( Adobe公司,需要插件)等。前端三大块1、HTML:页面结构2、CSS:页面表现:元素大小、颜色、位置、隐藏或显示、部分动画效果3、Jav原创 2021-09-01 12:04:18 · 311 阅读 · 0 评论 -
web前端技术笔记(八)屏幕适配、移动端布局
屏幕适配移动端与PC端页面布局区别视口视网膜屏幕(retina屏幕)清晰度解决方案适配布局类型PC及移动端页面适配方法流体布局响应式布局移动端与PC端页面布局区别视口视口是移动设备上用来显示网页的区域,一般会比移动设备可视区域大,宽度可能是980px或者1024px,目的是为了显示下整个为PC端设计的网页,这样带来的后果是移动端会出现横向滚动条,为了避免这种情况,移动端会将视口缩放到移动端窗口的大小。这样会让网页不容易观看,可以用 meta 标签,name=“viewport ” 来设置视口的大小,将原创 2021-08-28 01:09:07 · 1906 阅读 · 0 评论 -
web前端技术笔记(七)CSS3动画、选择器和权重
CSS3动画圆角效果图html二级目录三级目录圆角效果图html<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title> <style type="text/css"> .box{ width:300px; height:300px; border:3px solid原创 2021-08-26 11:05:35 · 446 阅读 · 0 评论 -
web前端技术笔记(六)首页布局
这里写目录标题新建项目首页头部制作logo 搜索框 购物车三级目录新建项目新建index.html<!-- html:xt + tab(需安装emmet 插件) --><!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd"><html xmlns="http://www.w3.org/原创 2021-08-23 21:29:21 · 1350 阅读 · 0 评论 -
web前端技术笔记(五)雪碧图、布局实例、图片格式
雪碧图雪碧图,就是将网页制作中使用的多个小图片合并成一个图片,使用css技术将这张合成的图片应用在网页不同的地方,雪碧图可以减少网页加载时的http请求数,优化网页性能。<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>雪碧图列表</title> <style type="text/css"> .list{原创 2021-03-19 21:46:47 · 769 阅读 · 0 评论 -
web前端技术笔记(四)块元素、浮动、定位、background属性
块元素、内联元素、内联块元素元素就是标签,布局中常用的有三种标签,块元素、内联元素、内联块元素,了解这三种元素的特性,才能熟练的进行页面布局。块元素块元素,也可以称为行元素,布局中常用的标签如:div、p、ul、li、h1~h6、dl、dt、dd等等都是块元素,它在布局中的行为:支持全部的样式 如果没有设置宽度,默认的宽度为父级宽度100% 盒子占据一行、即使设置了宽度内联元素内联元素,也可以称为行内元素,布局中常用的标签如:a、span、em、b、strong、i等等都是内联元素,它原创 2021-03-19 18:54:56 · 898 阅读 · 0 评论 -
web前端技术笔记(三)CSS作用、选择器、盒子模型
新建样式文件<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <met...原创 2019-06-04 17:24:47 · 329 阅读 · 0 评论 -
web前端技术笔记()js对象方法讲解
不带参函数的调用<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title> <script> window.onload=function(){ ...原创 2019-06-10 15:31:10 · 167 阅读 · 0 评论 -
web前端技术笔记()js简介与基本语法
<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>Title</title></head><body><p style="text-indent:2em">HT...原创 2019-06-06 11:39:50 · 162 阅读 · 0 评论 -
web前端技术笔记(一)html简介及常用标签、页面布局
<!DOCTYPE html> <!--html 文档声明,声明此文档是个html的文档--><!--快捷键:html+Tab--><html><!--html开始标签--> <head><!--网页的设置项和资源引用,不会呗显示--> <meta charset="...原创 2019-05-28 15:47:44 · 554 阅读 · 0 评论 -
web前端技术笔记(二)html 表单 和页面嵌套
1.相对路径和绝对路径2.有序和无序列表3.表格4.注册表单5.勾选框6.下拉框7.多行文本<!doctype html><html lang="en"><head> <meta charset="UTF-8"> <title>Document</title></hea...原创 2019-05-30 16:23:22 · 1973 阅读 · 0 评论