自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 element plus from表单实现空格字符

element plus 表单实现空格字符

2023-02-23 20:27:49 256 1

原创 js制作轮播图 css html js

拿走别客气 图片换一下就行。

2022-10-17 20:51:31 186

原创 dom 属性

是[W3C](https://baike.baidu.com/item/W3C) 组织推荐的处理[可扩展标记语言](https://baike.baidu.com/item/%E5%8F%AF%E6%89%A9%E5%B1%95%E7%BD%AE%E6%A0%87%E8%AF%AD%E8%A8%80)(html或者xhtml)的标准[编程接口](https://baike.baidu.com/item/%E7%BC%96%E7%A8%8B%E6%8E%A5%E5%8F%A3)。// 这个获得nav 元素。

2022-10-12 20:38:43 385

原创 js tab栏切换

今天我们制作一个tab栏切换废话不多说直接上代码。上面的是一些样子可以凭自己喜好编写样式。接下来是js代码简单易懂。下面是html的代码。

2022-10-11 19:50:50 144

原创 清除浮动的四种方法

父级div手动定义height,就解决了父级div无法自动获取到高度的问题。

2022-10-10 18:53:46 993

原创 密码显示js

今天我们写一个密码隐藏和点击看见的代码。首先我们先把css样式写出来。然后我们我们开始写js的样式。这样我们就把这个写完了。

2022-10-09 19:39:12 114

原创 api简介

API(Application Programming Interface,应用程序编程接口)是一些预先定义的函数,目的是提供应用程序与开发人员基于某软件或硬件得以访问一组例程的能力,而又无需访问源码,无需理解其内部工作机制细节,只需直接调用使用即可。此处的 Web API 特指浏览器提供的一系列API(很多函数或对象方法),即操作网页的一系列工具。- API 是为我们程序员提供的一个接口,帮助我们实现某种功能,我们会使用就可以了,不必纠结内部如何实现。比如充电器:我们要的是充电器的功能;

2022-10-08 18:39:05 179

原创 js作用域

根据在**[内部函数可以访问外部函数变量]**的这种机制,用链式查找决定哪些数据能被内部函数访问,就称作作用域链。通常来说,一段程序代码中所用到的名字并不总是有效和可用的,而限定这个名字的可用性的代码范围就是这个名字的作用域。- 只要是代码都一个作用域中,写在函数内部的局部作用域,未写在任何函数内部即在全局作用域中;变量提升(变量预解析): 变量的声明会被提升到当前作用域的最上面,变量的赋值不会提升。注意:函数声明代表函数整体,所以函数提升后,函数名代表整个函数,但是函数并没有被调用!

2022-09-29 19:03:25 51

原创 认识循环以及循环的应用

断点调试:在程序的某一行设置一个断点,调试时,程序运行到这一行就会停住,然后你可以一步一步往下调试,调试过程中可以看各个变量当前的值,出错的话,调试到出错的代码行即显示错误,停下。1、浏览器中按 F12--> sources -->找到需要调试的文件-->在程序的某一行设置断点。3、摁下F11,程序单步执行,让程序一行一行的执行,观察watch中变量的值的变化。- 条件表达式 用于执行循环的条件,满足继续执行,不满足退出。- 条件表达式为true,则执行循环体代码,否则退出循环。// 跳出整个循环。

2022-09-28 19:00:00 130

原创 js认识函数以及函数的应用

function 函数名(形参1, 形参2 , 形参3...) { // 可以定义任意多的参数,用逗号分隔。- return :不仅可以退出循环,还能够返回 return 语句中的值,同时还可以结束当前的函数体内的代码。- 由于函数一般是为了实现某个功能才定义的, 所以通常我们将函数名命名为动词,比如 getSum;参数的作用 : 在函数内部某些值不能固定,我们可以通过参数在调用函数时传递不同的值进去。// 准备一个变量,保存数字和。- 在使用 return 语句时,函数会停止执行,并返回指定的值。

2022-09-27 19:00:00 49

原创 数组的概念

数组可以通过索引(下标)来访问、设置、修改对应的数组元素,可以通过“数组名[索引]”的形式来获取数组中的元素,数组的下标是从0开始。- 如果设置的length属性值大于数组的元素个数,则会在数组末尾出现空元素,访问空元素时显示undefined;var arr = ['小明', '小红', '小兰', '大胖'];arr[arr.length] = '小帅';var arr = ['小明', '小红', '小兰', '大胖'];var arr = ['小明','小红', '大胖'];

2022-09-26 18:38:11 211

原创 js 运算符

由上到下执行代码的过程中,根据不同的条件,执行不同的路径代码,从而得到不同的结果。=== 全等号 要求值和数据类型必须相等举例: “3”===3 false,”3”==3 true。放在变量前面时,我们可以称为前置递增(递减)运算符,放在变量后面时,我们可以称为后置递增(递减)运算符。= 'chinese' &&++num 前置递增,就是自加1,类似于 num = num + 1,简写++num,,常见的运算符:算数运算符,递增和递减运算符,比较运算符,逻辑运算符,赋值运算符。

2022-09-24 20:00:00 128

原创 js数据类型

包括:boolean、byte、char、class、const、debugger、double、enum、export、extends、fimal、float、goto、implements、import、int、interface、long、mative、package、private、protected、public、short、static、super、synchronized、throws、transient、volatile 等。

2022-09-23 19:30:00 406

原创 初识JAVASCRIPT

ECMAScript是由ECMA国际(原欧洲计算机制造协会)进行标准化的一门编程语言,这种语言在万维网上应用广泛,被称为javascript(网景公司)和jscript(微软公司),它规定了编程语法和基础核心知识,是所有浏览器厂商共同遵守的一套JS语法工业标准。JS引擎:js解释器,用来读取网页种的js代码,然后对其处理,chrome的浏览器的v8,浏览器本身是不会执行JS代码,通过JS引擎解释,交给计算机去执行(逐行解释执行)。变量名是用来存取数据的容器,我们通过变量名来获取数据,数据是可以修改的。

2022-09-22 20:33:15 168

原创 js的简介

JavaScript诞生于1995年,它的出现主要是用于处理网页中的前端验证。所谓的前端验证,就是指检查用户输入的内容是否符合一定的规则。比如:用户名的长度,密码的长度,邮箱的格式等。但是,有的同学可能会有疑问,这些验证,后端不也可以进行验证吗?确实,后端程序的确可以进行这些验证,但你要清楚,在1995年那个年代,网速是非常慢的,向后端发送一个请求,浏览器很久才能得到响应,那这无疑是一种非常不好的用户体验。

2022-09-19 20:25:31 109 1

原创 项目答辩的注意事项

1) 页面数量2) 页面命名3) 页面功能4) 公共样式(公共部分和初始化样式)5) 完善的项目整体布局。

2022-09-18 16:21:27 148

原创 移动端开发vw+rem布局,即等比缩放布局(什么是vw?如何设置根元素html的字体大小?如何换算vw单位?文末:移动端开发步骤详解链接)

换算演示: 1px=100vw/320px=0.3125vw 100px=31.25vw 这样就完成了100px换算成对应屏幕大小的单位为vw的数值。那在默认的情况下,如果我们在二倍图的设计稿上量取的是88px,除以2,就为44px,再除以12,会得到除不尽的小数。例子: 用ps之类的软件打开UI给的二倍图的设计稿,如果测量得到的是750px,除以2后就是 375px,即该设计稿的机型是iPhone6。- 根据设计稿iphone6:375px=100vw(现在大部分的设计稿是iphone6)

2022-09-16 19:37:45 492

原创 table 切换效果

当h5的标签被添加show类别的时候,就会显示;当h5里的标签被添加hidden_样式的时候就会被隐藏。给出作为公共元素使用的几个h5标签。

2022-09-15 19:54:08 690

原创 less的使用方法

二、Less的基本用法1、变量2、嵌套3、extend和mixins4、混合函数三、Less的其他用法以上是less的基本用法谢谢大家

2022-09-14 20:51:01 589

原创 了解一下响应式开发

web网页开发的大致出现了以下几类:固定宽度的布局:给网页设置一个固定的宽度,通常以px作为单位,常见于PC端web开发。流式布局:给网页设置一个相对宽度,通常以百分比作为单位。栅格布局:像表格一样对页面进行划分,以每一个划分出的单元格为长度单位,比如bootstrap采用的就是栅格化的布局。响应式布局:通过检测设备信息来决定网页的布局方式,从而使网页可以匹配大部分移动设备和pc端。

2022-09-13 20:27:48 119

原创 css弹性盒子二

以下简单的布局需求是难以或不可能用这样的工具方便且灵活的实现的:在父内容里面垂直居中一个块内容。使容器的所有子项占用等量的可用宽度/高度,而不管有多少宽度/高度可用。使多列布局中的所有列采用相同的高度,即使它们包含的内容量不同。这些弹性盒子都可以实现。。。我草指定元素的布局为弹性盒子首先,我们需要给父元素设置display:flexdiv {}

2022-09-12 20:28:50 2718 2

原创 弹性盒⼦html

flex( Flexible Box 弹性盒⼦,伸缩盒)是css中的⼜⼀种布局⼿段,它主要⽤来代替浮动来完成⻚⾯的布局flex可以使元素具有弹性,让元素可以根据⻚⾯的⼤⼩的改变⽽改变-要使⽤弹性盒,必须先将⼀个元素设置为弹性容器 -通过display来设置弹性容器 display:flex 设置块级弹性容器 display:inline-flex 设置为⾏内的弹性容器-弹性容器的直接⼦元素是弹性元素(弹性项) 注意:⼀个元素可以同时是弹性容器和弹性元素 设置⽗元素flex后,⼦元素上的浮动,vertical

2022-09-08 20:52:48 98

原创 css动画演示

其实是个2D转动,只不过咱们设置椭圆,然后加上缩放(近大远小),看上去就是3D效果。

2022-09-07 19:14:25 507 3

原创 css设置背景图

一张清晰漂亮的背景图片能给网页加分不少,设计师也经常会给页面的背景使用大图,我们既不想图片因为不同分辨率图片变形,也不希望当在大屏的情况下,背景有一块露白,简而言之,就是实现能自适应屏幕大小又不会变形的背景大图,而且背景图片不会随着滚动条滚动而滚动。——视窗的高度,“视区”所指为浏览器内部的可视区域大小,即window.innerWidth/ window.innerHeight大小。以上就是我今天与你分享的内容,如果你觉得有帮助,请记得分享给你的朋友,也许能够帮助到他。

2022-09-06 20:41:56 6265 1

原创 定位的作用及使用方法

标准流在最底层 (海底) ------- 浮动 的盒子 在 中间层 (海面) ------- 定位的盒子 在 最上层 (天空)所以说, 一个行内的盒子,如果加了浮动、固定定位和绝对定位,不用转换,就可以给这个盒子直接设置宽度和高度等。静态定位是元素的默认定位方式,无定位的意思。固定定位是绝对定位的一种特殊形式: (认死理型) 如果说绝对定位是一个矩形 那么 固定定位就类似于正方形。注意:z-index 只能应用于相对定位、绝对定位和固定定位的元素,其他标准流、浮动和静态定位无效。每个都有自己的专门用法。

2022-09-05 18:55:18 520

原创 如何一个页面引用多个swiper插件

这就是基本的修改方式,值得一提的是swiper在使用中不予bootstrap冲突。这就是两个不同的swiper插件在一个页面中的使用,重点在于。上面的是html的代码。

2022-09-02 20:26:30 903 2

原创 制作轮播图

这里为了美观多加了点装饰。

2022-09-01 19:48:36 84

原创 css渐变色(2)

to top left 表示从右下向左上进行渐变(top和left可以交换位置,下同)使用角度表示,例如0deg等同于to top, 90deg等同于to right。使用turn,代表环绕圆圈的圈数,0.5turn表示半圈,也就是180deg。to bottom right 表示从左上向右下进行渐变。to top right 表示从左下向右上进行渐变。to bottom 表示从上往下的方式进行渐变。to left 表示从右往左的方式进行渐变。to top 表示从下往上的方式进行渐变。...

2022-08-31 20:15:44 3665

原创 css渐变色之线性渐变

background-image: linear-gradient(渐变方向, 颜色1[位置1], 颜色2[位置2], 颜色3[位置3]...);to top left 表示从右下向左上进行渐变(top和left可以交换位置,下同)使用角度表示,例如0deg等同于to top, 90deg等同于to right。to top right 表示从左下向右上进行渐变。to bottom 表示从上往下的方式进行渐变。to left 表示从右往左的方式进行渐变。to top 表示从下往上的方式进行渐变。...

2022-08-30 17:14:18 8997

原创 CSS常用选择器(通配符选择器,标签选择器,类选择器,id选择器 属性选择器

类选择器最大的优点是可以为元素对象定义单独或相同的样式,而且多个标记可以使用同一个类名,可以实现为不同类型的标记指定相同的样式。该语法中,id名即为HTML元素的id属性值,大多数HTML元素都可以定义id属性,元素的id值是唯一的,只能对应于文档中某一个具体的元素。但实际开发中不建议使用通配符选择器,因为它设置的样式对所有的HTML标记都生效,不管标记是否需要该样式,反而降低了代码的执行速度。标签选择器最大的优势是能快速为页面中同类型的标签统一样式,同时这也是它的缺点,不能设计差异化样式。......

2022-08-29 20:39:08 2013

原创 设置定义表单

常用的类型:text(文本输入框)、password(密码)、checkbox(复选框)、radio(单选框)、button(普通的按钮)、submit(提交按钮)、reset(重置按钮)、file(文件)可选值:post :将表单数据包含在表单单体发送更安全,所以常用与敏感数据的传送。date:设置日期 可以通过value设置初始日期,格式:1988-02-03。email:邮箱,提交表单时可以自动验证邮箱格式是否正确-->总结一下:与input设置按钮,button设置更灵活。今天二选一总结一下效果。.

2022-08-26 16:10:08 370 1

原创 设置定义表格

定义表格标签:tabletr:代表着行 td:设置单元格:th:单元格表头caption:标题cellspacing:设置边框合并cellpadding:设置内容离边框的距离单元格里面内容居中:水平方向:text-align:left/center/right;垂直方向: vertical-align:top/middle/bottomrowspan:合并纵向单元格colspan:合并行向单元格:合并单元格时注意点:合并时多余要删掉;表格的结构标签会改变内容位置;书写位置无关、

2022-08-25 16:14:25 572 3

原创 浮动简介的使用方法

浮动主要是用于元素的水平布局,用来设置元素浮动,元素脱离文档流后,就不会具有在文档流中的特点设置浮动float:;设置元素的浮动可选值none 默认值,元素正常显示,不浮动left 元素向左浮动right 元素向右浮动。

2022-08-24 20:55:08 239 1

原创 《默认样式》

所以我们往往在编写样式之前需要将浏览器中的默认的margin和padding统统的去掉。2、reset.css必须要在你写的css前引入,否则将会覆盖你写的.css文件。所以为很多的元素都设置了一些默认的margin和padding,浏览器为了在页面中没有样式时,也可以有一个比较好的显示效果,而它的这些默认样式,正常情况下我们是不需要使用的。1、link引入css文件,前提css必须要有。重置样式表,专门用来对浏览器的样式进行重置。1:清除浏览器的默认样式。

2022-08-22 20:20:46 120

原创 选择器的权重和字体样式

em 相对于当前字体的大小设置的,是一个相对单位,字体默认大小16px,若没设置字体大小,则继承其祖先元素字体大小,直到根标签默认字体大小16px、important>内联>id选择器>class选择器/属性选择器>元素选择器>通配选择器>继承选择器。可选值:center 居中、left(默认值)、right、justify(两端对齐)4.阴影的颜色(默认字体颜色)4.阴影的颜色(默认黑色)Rgba(red、green、blue 、0—1) 0是透明,1是不透明。Uppercase 文本大写。

2022-08-19 20:41:32 70

原创 css伪类选择器

important>内联>id选择器>class选择器/属性选择器>元素选择器>通配选择器>继承选择器。2.如果是交集选择器,则所有选择器权重相加,最终谁大听谁的。4.选择器的权重相加,再大也不会超过它上一级权重。3.如果是并集选择器,则选择器的权重各算各的。::before 在元素开始的位置前。注意: 1.选择器的权重一样,优先选用靠下的样式。::after 在元素开始的位置后。::selection 选中的内容。总结:哪个选择器越具体,权重越大。选择器的权重(面试题)..

2022-08-18 20:29:30 105

原创 css属性选择器

属性名*=属性值]{} 选择含有指定属性,只要含有某个属性值的元素。[属性名^=属性值]{} 选择含有指定属性以及指定属性值开头的元素。[属性名$=属性值]{} 选择含有指定属性以及指定属性值结尾的元素。[属性名=属性值]{} 选择含有指定属性以及指定属性值的元素。语法:[属性名]{} 选择含有指定属性的元素。...

2022-08-16 20:13:06 56

原创 css伪元素选择器

更容易让我们选择所选中的内容 方便我们选中。

2022-08-15 20:39:40 805

原创 css复合选择器

需求一:将class为red的诗句变为红色,同时将class为red的div字体变为24px。注意:如果选择器中有元素选择器,元素选择器必须要放在第一位。例如 div.red{} .red1#red2{}复合选择器 交集选择器, 并集选择器(群组选择器)语法:选择器1选择器2···{}作用:选中同时符合多个选择器条件的元素。...

2022-08-12 19:58:44 39

原创 css关系选择器

语法:#cs+英文状态下的波浪号+P{color+加颜色}作用:通过指定祖先元素找到指定的后代元素。作用:通过指定的父元素找到指定的子元素。语法:祖先元素 后代元素{}语法:父元素>子元素{}

2022-08-11 20:26:34 96

空空如也

空空如也

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

TA关注的人

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