自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(40)
  • 收藏
  • 关注

原创 登陆页面小demo

代码】登陆页面小demo。

2022-07-17 15:21:14 335 1

原创 Vue基础

初识Vue1.想让Vue工作,就必须创建一个Vue实例,且要传入一个配置对象;2.root容器里的代码依然符合html规范,只不过混入了一些特殊的Vue语法3.root容器里的代码被称为【Vue模板】4.Vue实例和容器是一一对应的5.真实开发中只有一个Vue实例,并且会配合着组件一起使用6.{{xxx}}中的xxx要写js表达式,且xxx可以自动读取到data中的所有属性7.一旦data中的数据发生改变,那么模板中用到该数据的地方会自动更新注意区分js表达式和js代码(语句

2022-05-08 18:07:18 350

原创 webpack的基本使用

什么是webpack概念:webpack是前端项目工程化的具体解决方案 主要功能:它提供了友好的前端模块化开发支持,以及代码压缩混淆、处理浏览器端Javascript的兼容性、性能优化等强大的功能。 好处:让程序员把工作重心放到具体功能的实现上,提高了前端开发效率和项目的可维护性。 注意:目前vue,React等前端项目基本上都是基于webpack进行工程化开发的 webpack基础 1、创建列表隔行变色项目 第五步中-S与--save作用效果一样 ..

2022-05-08 17:58:38 379

原创 轮播图练习

轮播图.html<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href="../CSS/轮播图.css"> <!--引入js文件--> <script src="../轮播图.js"> </script> <sc

2022-04-17 21:32:13 584

原创 动画函数使用

学习内容:动画实现原理,动画函数简单封装,缓动动画原理,动漫函数添加回调函数学习笔记:动画实现原理核心原理:通过定时器setInterval()不断移动盒子位置实现步骤:1.获得盒子当前的位置2.让盒子在当前位置上加上一个移动距离3.利用定时器不断重复这个操作4.加一个结束定时器的条件5.注意此元素需要添加定位,才能使用element.style.left实例:<!DOCTYPE html><html> <head> &

2022-04-17 00:49:19 443

原创 DOM基础学习2

学习内容:密码输入的显示于隐藏练习,元素操作--修改样式属性,排他思想,自定义属性的操作,tab栏切换练习学习笔记:密码输入的显示于隐藏练习<!DOCTYPE html><html> <head> <meta charset="UTF-8"> <title>document</title> <style> .box { position: relative; width:

2022-04-10 21:53:14 801

原创 DOM基础学习1

学习内容:API和Web API,DOM简介,获取元素,事件基础,操作元素-修改元素内容,元素操作-修改元素属性,属性操作-修改元素表单学习笔记:APIAPI 是一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力,或理解内部工作机制的细节。Web APIWeb API是浏览器提供的一套操作浏览器功能和页面元素的API(BOM和DOM)总结API是为我们程序员提供的一个接口,帮助我们实现某种功能,我们会使用就可以了,不必纠结内部如何实现We.

2022-04-03 22:18:27 1017

原创 手机端论文页面

html代码:<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"> <link rel="stylesheet" h

2022-03-27 19:15:52 266

原创 手机端项目动态页面

html代码:<!DOCTYPE html><html> <head> <meta charset="utf-8" /> <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"><link rel="stylesheet" hre

2022-03-27 19:11:10 112

原创 手机端最新动态页面

html代码:<!DOCTYPE html><html> <head> <meta charset="utf-8" /><meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1.0, maximum-scale=1.0, minimum-scale=1.0"><link rel="stylesheet" href=

2022-03-20 22:15:06 79

原创 rem适配布局

学习内容:线性背景渐变;rem基础;媒体查询;媒体查询+rem实现元素动态大小变化,引入资源;less基础学习笔记:线性背景渐变语法1:background: linear-gradient(起始方向,颜色1,颜色2......);背景渐变必须添加浏览器私有前缀起始方向可以是:方位名词或者度数,如果默认省略就是toprem基础rem单位rem(root em)是一个相对单位,类似于em,em是父元素字体的大小不同的是rem的基准是相对于html元素的字体大小。使用h.

2022-03-13 21:53:45 857

原创 移动端开发

学习内容:移动端开发选择;移动端技术解决方案,移动端常见布局学习笔记:移动端开发选择单独移动端页面(主流)通常情况下,网址域名前加m(mobile)可以打开移动端。通过判断设备,如果是移动设备打开,则跳到移动端页面。响应式兼容PC移动端通过判断屏幕宽度来改变样式,以适应不同终端。缺点:制作麻烦,需要花很大精力去调兼容性问题移动端技术解决方案移动端浏览器移动端浏览器基本以webkit内核为主,因此我们就考虑webkit兼容性问题我们可以放心使用H5标签和CSS3样式

2022-03-06 22:32:46 126

原创 移动端前端基础

学习内容:视口;视口标签,二倍图学习笔记:视口(viewport)视口就是浏览器显示页面内容的屏幕区域。视口可分为布局视口、视觉视口和理想视口。布局视口(layout viewport)一般移动端设备的浏览器都默认设置了一个布局视口,用于解决早期的PC端页面在手机上显示的问题。iOS,Android基本上都将这个视口分辨率设置为980px,所以PC上的网页大多都能在手机上呈现,只不过元素看上去很小,一般默认可以通过手动缩放网页。视觉视口(visual viewport)字面意

2022-03-05 10:54:40 212

原创 项目成果页面

html代码:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href="xiangmu.css"> </head> <body> <h1>项目成果</h1> <div class="banner">

2022-02-27 22:22:17 94

原创 论文部分页面

html代码:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href="lunwen.css"> </head> <body> <!-- 页面导航 --> <div class="daohang"> &l

2022-02-27 22:03:11 121

原创 部内动态页面

html代码:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href="bunei.css"> </head> <body> <h1>部内动态</h1> <div class="banner">

2022-02-20 21:13:51 215

原创 最新动态页面

html代码:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></title> <link rel="stylesheet" href="idx.css"> </head> <body> <h1>最新动态</h1> <div class="banner"> .

2022-02-20 21:10:02 362

原创 焦点图练习

html代码:<!DOCTYPE html><html lang="en"><head> <meta charset="UTF-8"> <title>156-定位练习2-焦点图</title> <link rel="stylesheet" href="CSS/index.css"></head><body> <h1>项目成果</h1><

2022-02-13 21:47:00 247

原创 前端定位方式

学习内容:了解定位、定位组成、五种定位方式学习内容:定位为什么需要定位当我们滚动窗口时,有些盒子是固定在某个位置的,这些效果,标准流或浮动都无法快速实现,此时需要定位来实现浮动可以让多个块级盒子一行没有缝隙排列显示,经常用于横向排列盒子定位则是可以让盒子自由在某个盒子内移动位置或固定屏幕中某个位置,并且可以压住其他盒子定位组成定位:将盒子定在某一个位置,所以定位也是在拜访盒子,按照定位的方式移动盒子定位=定位模式+边偏移定位模式用于指定一个元素在文档中的定位方式,边偏

2022-02-13 21:37:47 579

原创 JS数组基础学习

学习内容:forEach、slice和splice、数组的剩余方法、call和apply、arguments学习笔记forEach一般我们都用for循环遍历数组 JS中还为我们提供了一个方法,用来遍历数组 forEach() 只支持IE8以上的浏览器 forEach()方法需要一个函数作为参数;这种函数是由我们创建,但不是由我们调用的,称之为回调函数语法:arr.forEach(function(){}) ...

2022-01-30 18:15:19 882

原创 JS数组对象

学习内容:数组、数组字面量、数组的几个常用方法、数组遍历学习笔记:数组数组(Array),数组也是一个对象,它和普通对象功能类似,也是用来存储一些值的,不同的是普通对象是使用字符串作为属性名的,而数组是使用数字来作为索引操作元素索引:从零开始的整数就是索引;数组的存储性能比普通对象更好,在开发中我们经常使用数组来存储一些数据数组创建语法var arr =new Array();向数组中添加元素,语法,数组[索引]=值 var arr = new Array()..

2022-01-23 22:55:28 8354

原创 HTTP实用指南

学习内容:初识HTTP、协议分析、常见场景、实际应用学习笔记:初识HTTPHTTP协议(Hyper Text Transfer Protocol)超文本传输协议,HTTP是一个应用层协议,由请求和响应构成,是一个标准的客户端服务器模型。HTTP是一个无状态的协议,基于TCP协议。协议分析MethodSafe(安全):不会修改服务器的数据的方法(GET、HEAD、OPTIONS)Idempotent(幂等):同样的请求被执行一次与被执行多次的效果是一样的,服务器的状态也是一

2022-01-23 18:55:30 1626

原创 基础学习+练习

学习内容:原型对象学习笔记:原型(proototype)我们所创建的每一个函数,解析器都会像函数中添加一个属性prototype这个属性对应着一个对象,这个对象就是原型对象如果函数作为普通函数调用prototype没有任何作用当函数通过构造函数的形式调用时,它所创建的对象中都会有一个隐含的属性,指向该构造函数的原型对象,我们可以通过__proto__来访问该属性原型对象就相当于一个公共的区域,所有同一个类的实例都可以访问到这个原型对象我们可以将对象中共有的内容,统一设置到原型对象

2022-01-17 22:06:42 311

原创 HTML学习笔记和基础练习

学习内容:HTML音频、视频、部分练习HTML音频<audio> 元素是一个 HTML5 元素,在 HTML 4 中是非法的,但在所有浏览器中都有效。用法:<audio src=" ./ 音频来源路径" controls></audio>实例:<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title></t

2021-12-26 20:41:49 208

原创 web基础

学习内容:网络、HTTP协议、web服务器网络终端、PC、手机、IP电视、空调、冰箱网络:把各种终端连在一起就形成了网络拓扑结构分类:总线型结构、环形结构、星型结构、网状按覆盖范围分:局域网LAN(几米到几十米)、域域网(介于LAN与WAN之间)、广域网(几十到几千公里)按连接介质分:无线、有线、光纤按连接协议分:手机、http网络主要功能:资源共享、快速传输信息、提高系统可靠性、易于进行分布式处理、综合信息服务网络..

2021-12-19 17:24:15 604

原创 JS基础学习5

学习内容:作用域(全局作用域,函数作用域),this关键字,构造函数学习笔记:作用域: 作用域指一个变量的作用范围 在JS中有两种作用域,一个是全局作用域,一个是函数作用域全局作用域:直接编写在script标签中的JS代码,都在全局作用域;全局作用域在页面打开时创建,在页面关闭时销毁。在全局作用域中有一个全局对象window(代表着一个浏览器的窗口,它由浏览器创建),我们可以直接使用。在全局作用域中创建的变量都会作为window对象属性保存;创建的函数都会作为windo...

2021-12-12 21:34:15 247

原创 JS基础学习4

学习内容:函数,学习笔记:函数:函数是一个对象,函数可以封装一些功能(代码),在需要时执行这些功能(代码);函数中可以保存一些代码,在需要的时候调用使用typeof检查一个函数对象时,会返回function创建一个函数,可以将要封装的代码以字符串的形式传递给构造函数,但封装到函数中的代码不会立即执行,函数中的代码会在函数调用时执行,(但我们在实际开发中很少使用构造函数来创建函数对象)调用函数语法,函数对象+()当调用函数时,函数封装的代码会按顺序执行...

2021-12-05 22:12:44 50

原创 JS基础学习3

学习笔记:对象:在 JavaScript 中,对象是王。在 JavaScript 中,几乎“所有事物”都是对象。布尔是对象(如果用new关键词定义) 数字是对象(如果用new关键词定义) 字符串是对象(如果用new关键词定义) 日期永远都是对象 算术永远都是对象 正则表达式永远都是对象 数组永远都是对象 函数永远都是对象 对象永远都是对象所有 JavaScript 值,除了原始值,都是对象。原始值原始值指的是没有属性或方法的值。原始数据类型指的是拥...

2021-11-28 22:27:29 360

原创 JS基础学习2

学习内容:条件判断语句;条件分支语句学习笔记:流程控制语句通过流程控制语句可以控制程序执行流程,使程序可以根据一定的条件来执行语句分类:1.条件判断语句 2.条件分支语句 3.循环语条件判断语句:使用条件判断语句可以在执行某个语句之前进行判断,如果条件成立才执行语句,条件不成立则不执行if 语句使用if语句来规定假如条件为 true 时被执行的 JavaScript 代码块。if(条件表达式) 语句语法if (条件){ 如果为tr...

2021-11-21 23:08:00 644

原创 JS基础学习1

学习内容:字面量

2021-11-14 22:23:23 718

原创 JavaScript 学习

学习内容:初识JS,JS代码编写位置,JS基本语法,标识符,字面量和变量笔记:1、初识JSJavaScript(简称“JS”)是当前最流行、应用最广泛的客户端脚本语言,用来在网页中添加一些动态效果与交互功能,在 Web 开发领域有着举足轻重的地位。JavaScript 与 HTML 和 CSS 共同构成了我们所看到的网页,其中:HTML 用来定义网页的内容,例如标题、正文、图像等; CSS 用来控制网页的外观,例如颜色、字体、背景等; JavaScript 用来实时更新网页中的内容,例

2021-11-07 20:39:19 974

原创 CSS学习3

学习内容:CSS三大样式表;emmet语法;CSS复合选择器;学习笔记:CSS三大样式表:1、内部样式表(嵌入式)内部样式表是写入html页面内部,将所有CSS代码抽取出来,单独放到一个<style>标签里语法:<style> div { color: red; font-size: 12px; }</style><style>理论上可以放到HTML文档的任何地方,但一般会放在文档的<head.

2021-10-27 14:28:07 762

原创 CSS入门学习2

学习内容:字体的设置,学习笔记:font-family设置字体系列:基本语法:font-family:字体1,字体2,字体3,......;语法说明:应用font-family属性可以一次定义多个字体,各种字体之间必须用英文状态下的逗号隔开,而在浏览器读取字体时,会按照定义的先后顺序来决定选用哪种字体。若浏览器在计算机上找不到第种字体,则自动读取第二种字体,第二种找不到就读取第三种字体,依次类推。如果定义的所有字体都找不到,则选用计算机系统的默认字体。...

2021-10-23 15:21:26 80

原创 CSS学习1

学习内容:CSS简单了解,CSS语法,CSS选择器学习笔记CSS作用:CSS的主要使用场景是美化网页,布局页面的CSS是层叠样式表的简称,也是一种标记语言HTML主要做结构,显示元素内容CSS美化HTML,布局页面CSS最大价值:使样式和结构分离CSS 语法<style></style>样式标签在<head></head>标签里CSS 规则主要由选择器和一条或多条声明组成:h1(选择器) { color: red;

2021-10-17 20:24:22 73

原创 HTML 入门学习2

学习内容:列表(无序列表,有序列表);表单笔记:

2021-10-10 18:56:51 158

原创 HTML 入门学习

学习内容:属性标签,表格,背景颜色和图片,超链接,

2021-10-03 00:00:35 158

原创 HTML 笔记

什么是HTML?Hyper Text Markup language超文本标记语言HTML 运行在哪里?运行在浏览器上HTML怎么开发?新建一个.html或.htm结尾的文件使用记事本打开就能开发,浏览器打开就能运行,不需要编译·...

2021-09-28 16:53:56 62

原创 C语言养成计划3——函数

学习内容:函数定义和使用;学习笔记:函数定义和使用:函数定义:返回类型 函数名(形式参数){ 声明 语句}

2021-09-23 17:31:22 72

原创 C语言养成计划2

学习内容:跳转语句(break,continue,goto);数组定义和使用;冒泡排序;二维数组;字符数组和字符串学习笔记:跳转语句:1.break(用于swtich语句和循环语句);当用于switch语句时,作用是终止某个case并跳出switch结构当用于循环语句时,作用是跳出当前循环体,执行后面的代码当用于嵌套循环语句时,可以跳出最近的内循环,执行后面的语句(break语句在循环结构中是跳出最近的循环体)continue语句用于循环语句...

2021-09-17 10:39:30 113

原创 C语言养成计划1

学习内容类型转换;switch语句;循环结构(while ,do while , for),嵌套循环笔记整理类型转换不同类型数据之间会涉及到类型转换问题。转换方法:1.自动转换(隐式转换):遵循一定规则,由编译系统自动完成2.强制转换:把表达式的运算结果强制转换为所需的数据类型 强制类型转换运算符不会四舍五入 !!!! switch语句:switch用法:switch(){printf();break;} ...

2021-09-10 19:57:14 202 1

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除