自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 数组对象和正则

/ 带参数 按照number类型比较 sort(function(a,b){ }) // a和b是相邻的两个数据。"name":"迪丽热巴","age":19,"date":"2003-4-1""name":"李三","age":15,"date":"2006-4-1""name":"杨思","age":12,"date":"2009-4-1"

2022-10-07 20:37:17 721

原创 JavaScript数组

=数组 存储数据的容器 可以存储任意数据类型 可以存储任意多个==

2022-10-07 20:36:45 141

原创 Date对象和String类型

document.body.innerHTML = "还剩余" + suppleZero(t) + "天" + suppleZero(h) + "时" + suppleZero(m) + "分" + suppleZero(s) + "秒"console.log(name.split("、"));// charCodeAt(下标) "A"----65 "a"----97 "0"----48。// 星期 ["星期日","星期一","星期二","星期三","星期四","星期五","星期六"]

2022-10-07 20:35:58 177

原创 函数封装和Math对象

本地对象「内部对象」:JS中的内部对象包括Array、Boolean、Date、Function、Global、 Math、Number、Object、RegExp、String,Error对象, 其中Global和Math这两个对象又被称为“内置对象”,这两个对象在脚本程序初始化时被创建,不必实例化这两个对象。例如遥控器,不同的按键不同的功能,都是提前定义好的。// timer这里存储的就是定时器id 先把原先的定时器清除掉。// timer这里存储的就是定时器id 先把原先的定时器清除掉。

2022-10-07 20:34:25 94

原创 定时器和函数封装

定时器的分类延时定时器语法: setTimeout(函数,时间)作用: 延迟一定的时间再去执行函数里面的代码,只会执行一次使用场景 :广告弹窗间歇定时器语法:setInterval(函数,时间)作用:每隔一定的时间就去执行函数中的代码 会执行多次使用场景:轮播图 倒计时 计时器 抽奖==注意:定时器的时间单位是ms 1s = 1000ms==

2022-10-07 20:33:50 68

原创 自定义属性与函数

2.1 定义属性属性的分类固有属性:系统给的 id class title自定义属性:程序员自己定义的 tag index添加自定义属性直接添加标签上(暂时获取不到)//2.自定义属性直接写行间,可以直观看见,暂时无法获取写在行间的自定义属性使用js添加:标签.属性名 = 属性值//3.通过js添加自定义属性,标签上看不见,但是可以直接使用//true2.2.2 自定义属性使用场景多组开关效果(自定义属性)​自定义索引。

2022-10-07 20:33:16 106

原创 循环结构和this和自定义属性

3.4.1什么是属性什么是属性:存在开始标签上 属性名=属性值 例如class="box" id="wrap"固有属性:系统给定的属性 例如 class id style href src自定义属性:程序员自己定义的属性3.4.2设置和获取自定义属性如何设置和获取自定义属性

2022-10-07 20:32:46 59

原创 数据类型和流程控制语句

/ 总结:Number可以转换的有:string类型(纯数字,""-0 " "-0) boolean(true-1 false-0) null(0)// parseFloat: 将数据转换成number类型,从左往右转换,遇到不能转换的或者是末尾结束,如果一开始都不能转换则是NaN 保留小数。console.log(10==="10")//false ===在进行比较的时候 不会隐式转换 必须一模一样才可以。console.log(11%2==0)//true 偶数 false 奇数。

2022-10-07 20:32:04 84

原创 day02 JS交互

/ 2.设置样式 标签.style.样式名 = 值 注意:如果是-链接的样式 需要改成小驼峰命名 例如background-color改为backgroundColor。/*------------------------------了解-----------------------------*/// 5. 16进制 以0x开头 范围0-9 a-10 b-11 c-12 d-13 e-14 f-15。//string "检测数据"//"11" 是字符串的类型11。

2022-10-07 20:31:33 46

原创 JavaScript介绍

HTML--超文本标记语言---结构CSS---层叠样式表-----样式js---js脚本语言---网站交互==基于对象和事件驱动的解释性脚本语言==基于对象:JavaScript 是一种基于对象的语言,这意味着它能运用自己已经创建的对象,因此,许多功能可以来自脚本环境中对象的方法与脚本的相互作用。事件驱动:JavaScript 可以直接对用户或者客户输入做出响应,无须经过 web 服务器,它对用户的响应,以事件驱动的方式进行。解释性解释性:可以直接识别,读一行执行一行。

2022-10-07 20:30:56 78

原创 css网格布局

*********************只能实现矩形的合并*********************************************grid 布局则是将容器划分成不同的“行”和“列”,产生单元格,让和指定“项目所在单元格”,可以看作是二维布局,space-evenly:项目与项目的间隔相等,项目与容器边框之间也是同样长度的间隔。--以上代码中sectione为容器,div为项目(项目不包括p标签)-->如果一个m行n列的网格,需要m+1+n+1条线,m+1条横线,n+1条纵线。...

2022-08-17 20:00:29 1041

原创 css 3D动画

什么是3d的场景呢?2d场景,在屏幕上水平和垂直交叉线x轴和y轴3d场景,在垂直于排名的方向,相对于3d多出个z轴Z轴靠近屏幕方向是正值,远离屏幕的方向是反向css3中的3d变换主要包含以下几种功能函数:3d位移:css3中3d位移主要包含tanslateZ()和translate3d()两个函数;...

2022-08-17 19:59:45 456

原创 css 2D动画

设置left(定位,内边距,外边距等等)属性会频繁的造成浏览器回流重拍,而transform和opacity(半透明属性)属性不会,因为它是作为合成图层发送到GPU上,由显卡执行的渲染,这样做的优化如下。对角移动:右下角移动translate(tx,ty),右上角移动translate(tx,-ty),左上角移动translate(-tx,-ty)和左下角移动translate(-tx,ty)这种效果可以在鼠标单击,获得焦点,被点击或对元素任何改变种触发,并圆滑的以动画效果改变css的属性值。...

2022-08-17 19:58:51 566

原创 CSS渐变

css3渐变(gradient)可以让你在两个或多个指定颜色之间显示平稳过渡。以前,你必须使用图像来实现这些效果,现在通过css3的渐变(gradient)即可实现。此外,渐变效果的元素在放大时看起来效果更好,因为渐变(gradient)是由浏览器生成的uigradients.com选色。...

2022-08-17 19:57:43 307

原创 rem布局开发

/fontsiz=当前设备的布局宽度/物理分辨率(设计稿宽度)*基准font-size,不需要自己除以2。//新设备比原来大多少倍就会自动设置html的font-size大多少倍,750*100+'px'是现在设备的大小设置。rem相对单位,相对于根元素(html)的字体大小,divwidth10rem;em相对单位,相对于父元素的字体大小单位,父元素字体大小为16px,1em=16px。rem的大小是以html的faont-size为基准。750是当前页面的大小,100是html设定的大小。......

2022-08-17 19:30:48 98

原创 css响应式布局

按照屏幕大小进行动态的响应,快速的反应让所有的屏幕都可以得到很好的显示。

2022-07-18 19:35:29 105

原创 css弹性盒

拉伸,在没有设置高度的情况下,会默认拉伸撑开到整个母盒子的高度。space-around距离环绕,第一个盒子与第二个盒子的距离正好是第一个盒子与大盒子的距离,左右外边距一致。3.弹性盒居中,只有一个元素的时候,加marginauto;适用主轴方向,横轴为主轴,则占满宽度,纵轴为主轴,则占满宽度。默认值为1,空间不够会产生挤压,更改值为0,就不允许被挤压,align-selfflex-end;则div1占1/5,daiv2占1/5,div3占3/5。align-selfflex-start;...

2022-07-18 19:33:50 1464

原创 css字体引入

font-face是css3中的一个模块,他主要是要把直接定义的web字体嵌入到你的网页中,随着@font-face模块的出现,我们在web的开发中使用字体不怕只能使用web安全字体(@font-face这个功能早在ie4就支持)1.YourWebFontName此值指的就是你自定义的字体名称,最好使用你下载的默认字体,他将被引用到你的web元素中的font-family.如“font-family"yourwebfontname";[font-weight];...

2022-07-18 19:33:13 451

原创 css圆角属性

border-radius盒子宽度的一半px;例border-radius50px50px0px0px;border-top-left-radius10px;border-top-right-radius10px;border-bottom-left-radius;border-bottom-right-radius;例border-radius200px000;border-垂直方向-水平方向-radius;写两个值左上角和右下角,左下角右上角一致。...

2022-07-18 19:32:27 203

原创 css阴影

inset内阴影在盒子内部加阴影。从外层的阴影(开始时),改变阴影内侧阴影。h-shadow必需的。v-shadow必需的。10px网垂直方向上的位移默认往下,可设置负值。顺序10px往水平方向的位移默认往右,可设置负值。color可选阴影的颜色。阴影的大小spread在模糊后面,颜色前面设置。两个不同的阴影用逗号隔开即可。可设置多个阴影,设置方式为。...

2022-07-18 19:31:45 495

原创 html5基础与语法

video元素audio元素

2022-07-18 19:31:06 545

原创 表单进阶 单选框 多选框

textareaclass="aa"placeholder="请输入你的意见">aaa抽烟。喝酒。男。女。

2022-07-18 19:29:44 4828

原创 两栏布局 三栏布局

需注意,运算符前后都需要保留一个空格,例如widthclac(100%-10px)任何长度的值都可以用calc()函数进行计算;calc()函数使用标准的数学运算优先级规则;

2022-07-18 19:27:57 36

原创 定位的深入研究

z-index层级 绝对定位的层级 绝对定位可以把行内标签改变为块元素 定位控制元素垂直居中 浮动与定位的区别

2022-07-18 19:25:53 28

原创 HTML伪元素

2)before{与content属性一起使用,定义在对象前面的内容。1)after{与content属性一起使用,定义在对象后面的内容。如divafter{contenturl(logo.jpg);如divbefore{content"在其前面放内容"}divafter{centent"文本内容";3)first-letter定义对象第一个字符的样式。4)first-line定义对象内第一行文本的样式。......

2022-07-18 19:20:49 556

原创 宽高自适应

自适应网页布局中经常要定义元素的宽和高。但很多时候我们希望元素的大小能够根据窗口或者子元素调整,这就是适应。

2022-07-15 21:43:16 172

原创 HTML精灵图

一,将导航背景图片,按钮背景图片等有规则的合并成一张背景图片,即将多张图片合为一张整图,然后用background-position“来实现背景图片的定位技术。csssprites的原理(图片整合技术)(css精灵)/雪碧图。1)通过图片整合来减少对服务器的请求次数,从而提高面的加载速度。2)通过整合图片来减小图片的体积。...

2022-07-15 21:42:13 159

原创 定位的深入研究

两个盒子都有定位,后面的盒子会把前面的盒子盖住。

2022-07-15 21:40:53 41

原创 css三角形写法

盒子宽高设置为0,设置四边边框,隐藏三边为透明色,留下自己需要的一个边。梯形只设宽度或高度,其他同理。

2022-07-15 21:39:56 50

原创 html元素定位

2.positionabsolute;绝对定位脱离a.当没有父元素或者父元素没有定位,参照物是浏览器窗口的第一屏。z-index属性是不带单位的,并且可以给负值,没有设置z-index时,最后写的对象优先显示在上层设置后,数值越大,层越靠上。b.有父元素且父元素有定位,父元素。粘性定位可以做吸顶效果,粘性定位是css3.0新增的,兼容不好。相对于自己原来位置偏移,偏移后可以覆盖在别的位置,不会脱离文档流还会再原位置占位。位置相对于父元素左上角。会脱离文档流,位置相对于浏览器一直不动。...

2022-07-15 21:35:05 299

原创 元素显示类型

2.内联元素没有自己的形状,不能定义他的宽和高,他显示的宽度,高度只能根据包含你内容的高度和宽度来确定,他的最小内容单元也会呈现矩形形状,4.块状元素一般都作为其他元素的容器,他可以容纳其他内联元素和其他块状元素。2.默认情况下,块状元素都会占据一行;例如divpulliollidldtddh1-h6等。1.块状元素子网页中就是以块的显示,所谓块状就是元素显示为矩形区域;内联块状元素就是提示具备内联元素,块状元素的特点。可以设置外边距,内边距,边框,可以设置宽高。...

2022-07-15 21:34:10 127

原创 html溢出属性

*-webkit-scrollbar,可以实现对滚动条的定制,配合displaynone;overflowvisble/hidden(隐藏)/scroll/auto自动/inherit;nowrap文本不会换行,文本会在同一行上继续,直到遇到标签为止;4.溢出文本显示省略号text-overflowellipsis;auto如果有溢出属性会添加滚动条,没有溢出正常显示;visble默认值,溢出内容会显示在元素之外;pre-line只显示回车,不显示空格,换行。...

2022-07-15 21:32:47 1034

原创 html盒子模型

css定义所有的元素都可以拥有像盒子一样的外形和平面快捷,即都包含边框,编辑,补白,内容区,这就是盒模型。1.子margin-top==>父的padding-top,注意高度计算给父盒子加内边距。5.屏幕水平居中margin0pxauto;padding内边距内容区大小不会改变,会增加四边厚度。两个盒子水平方向外边距会合并处理,外边距相加。3.三个值,上左右都一样下。2.两个值,上下,左右都一样。1.一个值,四个方向都一样。内容区内边距边框外边距边框内边距内容区。...

2022-07-15 21:30:22 200

原创 css属性和属性值

css属性和属性值 css文本属性 css列表属性 css背景属性 浮动属性

2022-07-15 21:26:21 686

原创 css选择器

CSS选择器。目标伪类选择器 UI元素状态伪类选择器 否定伪类选择器 动态伪类选择器 元素选择器 class选择器/类选择器 id选择器 通配符/通配选择器 群组和后代选择器 伪类选择器 选择器的权重

2022-07-15 21:23:38 136

原创 css样式表

如div,p,h1,img,a,span,i,em,strong,b,ul,li,ol,li,...等等。语法选择符1,选择符2,选择符3...{属性属性值;用法当我的元素存在父级元素的时候,我要改变直接本身的样式,可以另加选择符,直接用包含选择器的方式解决。css选择器解析规则1当不同选择符的样式设置有冲突的时候,高权重选择符的样式会覆盖地权重选择符的样式。当多个选择器,选中的是同一个元素,且都为大门定义了样式,如果属性方式冲突了,会选择权重高的来执行。aactive{属性属性值;...

2022-07-14 21:54:40 377

原创 html 列表,表格

1.有序列表li里可以随意放标签,但是ol里只能放li标签数字是自动生成的type:1,a,A,i,I start:取值只能是一个数字 type 确定排列符号 start决定从第几个开始 2.无序列表 快捷输入 ul>li{1111}*3 1.ul里只能放li,li里面可以放其他标签 2.默认的是黑色的实心圆 3.type, disc默认实心圆 circle空心圆 ...

2022-07-13 20:16:13 511

原创 html 超链接标签

html 超链接标签 a标签

2022-07-12 19:46:01 247

原创 1.html 基础

w3c 网址 w3.orghtml指的是超文本标记语言 html不是一种编程语言,而是一种标记语言 标记语言是一套标记标签网页的拓展名称是.html html使用标记标签来描述网页 caniuse.com 查询代码兼容浏览器web的组组成部分 1.html结构 w3c 制定了结构 html的语法 标准2.css表现 w3c 制定了结构 css的语法 标准3.js行为 w3c ecma制定了行为标准......

2022-07-11 20:16:32 78

空空如也

空空如也

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

TA关注的人

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