自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

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

原创 JS中String属性

字符串创建String(字符串) 返回字符串 new String(字符串) 返回字符串对象 String.fromCharCode(65,67,68) 从ascii码创建字符串 //使用string时,可以有两种方法创建对象: //(1)使用new关键字创造时,var mystr=new String('字符串对象测试') //(2)直接使用字符串赋值 var mystr='字符串对象' //length属性:用来返回字符串的长度 —...

2022-04-27 18:45:14 149

原创 Date 对象

js的七大数据类型string number boolean symbool undefieng // umllobject(array function)js的构造函数独一无二的的值string number boolean symbool object array // function regexp(正则)基本数据类型string number boolean symbool undefieng null返回一个 指定的字符串值最后出现的位置

2022-04-26 18:25:18 103

原创 js——Date对象

创建一个 JavaScriptDate实例,该实例呈现时间中的某个时刻。Date对象则基于Unix Time Stamp,即自1970年1月1日(UTC)起经过的毫秒数。const date1 = new Date('December 17, 1995 03:24:00');// Sun Dec 17 1995 03:24:00 GMT...const date2 = new Date('1995-12-17T03:24:00');// Sun Dec 17 1995 03:24:0...

2022-04-25 22:17:19 214

原创 JS数组小知识

1、内置 array.filter()模式:异地。这个方法基本上接收一个项目列表,然后使用一个决定性的函数来决定什么将保留,什么将从数组中消失。然后它创建一个新数组(是JavaScript 数组对象的新地址),接着,你可以将其分配给你正在过滤的数组。这样,通过JavaScript 数组过滤器让你可以选择将结果放入新的JavaScript 数组或分配给应用操作的原始数组,以删除你不想要的结果。例如:// create a new array of numbers one to tenlet nu

2022-04-24 22:24:44 1365

原创 JS对象及数组

自定义对象:语法:let 对象 ={ }给对象添加属性:对象.属性 = 属性值,删除一个对象的属性:delete 对象.属性。内置对象:Array:用于在单独的变量名中存储一系列的值。Date:用于操作日期和时间。String:用于支持对字符串的处理。Math:用于执行常用的数学任务,它包含了若干个数字常量和函数。对象中没有的属性,获取时也不会报错,而是返回一个undefined;对象的属性值可以是任意数据类型,属性名不强制要求标识符规则;但是还是要遵守这个规则比较好。方便养

2022-04-22 21:44:41 157

原创 JS循环及调试

breakbreak:用于终止某个循环,使程序跳到循环块外的下一条语句,在循环中位于break后的语句将不再执行,break语句不仅可以用在for循环中,也可以用在其他循环中。for (var i = 0; i < 5; i++) { //当i的值是3的时候,整个循环就终止了,不再继续循环了. if (i == 3) { break; } document.write(i+'<br>')continuecontinue:退出本次循...

2022-04-21 22:29:08 132

原创 JavaScript函数与选择结构

if 结构语法: if(条件){ JavaScript语句 } 该语句要求条件必须为真,才会执行{}里面的JavaScript语句。这里的条件 只会返回布尔类型 不是true 就是false 多重if结构语法:if(条件1){ JavaScript语句1}else ...

2022-04-20 20:58:19 770

原创 JS变定量及for循环

变量提升:变量提升即是将变量声明提升到它所在作用域最开始的部分。举个例子:$(function() { console.log(num); // 值:undefined 执行顺序1 var num = 0; function set(num1) { num++; console.log(num); // 值:1 执行顺序3 return num; } console.log(num); //值:0 执行顺序2

2022-04-19 22:24:30 75

原创 JS逻辑运算符、输出语句注释及选择结构

JS字符集JavaScript 使用 Unicode 字符集。Unicode 覆盖了所有的字符,包含标点等字符。5.JS注释JavaScript 不会执行注释,我们可以添加注释来对 JavaScript 进行解释,或者提高代码的可读性。注释用于阻止其中一条代码行的执行(可用于调试)5.1 单行注释单行注释以 // 开头。// 输出标题:document.getElementById("myH1").innerHTML="Welcome to my Homepage";// 输出...

2022-04-18 22:21:02 655

原创 JS数据类型及运算

JavaScript 变量能够保存多种数据类型:数值、字符串值、数组、对象等等:Boolean类型:只有两个字面量true和false。但是js中多有的变量都可以使用Boolean()函数转换成一个Boolean类型的值。a Number。这个数值用于本来要返回一个数值,但是却未能放回一个数值的情况,以防止报错。例如:1/0返回的就是NaN。typeof操作符:对一个变量进行推断变量的类型,可能返回以下字符串:"undefined"未定义或者未初始化“boolean” 布尔值“string”

2022-04-17 22:51:02 512

原创 html行内元素水平居中显示

1.块级元素水平垂直居中方法112 position: absolute/fixed;3 left:0;4 top:0;5 right: 0;6 bottom: 0;7 margin:auto;方法2:12 position: absolute/fixed;3 left:50%;4 top:50%;5 margin-left:-盒子宽度的一半;6 margin-top:-盒子高度的一半;2.行内块元素水平居中给父元素加 : text­alg

2022-04-15 22:52:56 288

原创 媒体查询及响应式布局

媒体查询的用途媒体查询Media Queries,可以根据不同的设备为其实现不同的样式。@media可以根据不同的屏幕尺寸设置不同的样式,页面布局分别适应移动端、pc端等,在调整浏览器的大小,页面会根据媒体的宽度和高度来重新布置样式。媒体查询可以用于检测很多东西:自动检测viewpoint(视窗)的宽度和高度;设备的宽度和高度;旋转方向(智能手机横屏或竖屏);分辨率大小。语法直接写在css样式中@media mediatype and/not/only (media feature) { CS

2022-04-14 23:53:17 259

原创 Flex弹性盒布局2

SS Flexbox 布局模块在 Flexbox 布局模块(问世)之前,可用的布局模式有以下四种:块(Block),用于网页中的部分(节) 行内(Inline),用于文本 表,用于二维表数据 定位,用于元素的明确位置 Flexbox 元素 如需开始使用 Flexbox 模型,您需要首先定义 Flex 容器。 上面的元素表示一个带有三个 flex 项目的 flex 容器 父元素(容器) 通过将display属性设置为flex,flex 容器将可伸缩: ...

2022-04-14 00:50:41 59

原创 类命名的规范

常用词汇:(一)内容头:header  内容:content/container  尾:footer  导航:nav  侧栏:sidebar栏目:column  页面外围控制整体布局宽度:wrapper  左右中:left right center登录条:loginbar  标志:logo  广告:banner  页面主体:main  热点:hot新闻:news  下载:download  子导航:subnav  菜单:menu子菜单

2022-04-13 16:33:52 639

原创 弹性布局flex

flex 属性用于设置或检索弹性盒模型对象的子元素如何分配空间。flex 属性是 flex-grow、flex-shrink 和 flex-basis 属性的简写属性。flex: auto | initial | none | inherit | [ flex-grow ] || [ flex-shrink ] || [ flex-basis ]1auto: 计算值为 1 1 autoinitial: 计算值为 0 1 autonone:计算值为 0 0 autoinherit:从父元素.

2022-04-12 23:51:27 213

原创 css3 动画的使用过程

3D动画又叫做3D变形2D动画只有x,y轴3D动画多了个z轴,让元素变得立体起来3D动画跟以前我们学习物理时3D坐标系有点相识但是并不是一样的,毕竟现在我们要做的是动画,电脑里面的.x轴左边是负,右边是正y轴上边是负,下边是正z轴里面是负,外面是正1.rotateX()沿着x轴立体旋转rotateY()沿着y轴立体旋转rotateZ()沿着z轴立体旋转rotate3d(x,y,z,角度(deg))前三个参数取值范围是0到1,后面的角度也是必须带单位的,但是即使大家把它写入里面也无

2022-04-11 21:39:09 214

原创 CSS3过渡

如何使用 CSS 过渡?如需创建过渡效果,必须明确两件事:您要添加效果的 CSS 属性 效果的持续时间注意:如果未规定持续时间部分,则过渡不会有效果,因为默认值为 0。下面的例子展示了 100px * 100px 的红色 <div> 元素。 <div> 元素还为 width 属性指定了过渡效果,持续时间为 2 秒:实例div { width: 100px; height: 100px; background: red; transition:

2022-04-10 16:20:18 87

原创 CSS定位

position 属性position属性规定应用于元素的定位方法的类型。有五个不同的位置值:static relative fixed absolute sticky元素其实是使用 top、bottom、left 和 right 属性定位的。但是,除非首先设置了 position 属性,否则这些属性将不起作用。根据不同的 position 值,它们的工作方式也不同。position: static;HTML 元素默认情况下的定位方式为 static(静态)。静态定位的元.

2022-04-08 23:40:34 71

原创 CSS 2D 转换

CSS 转换(transforms)允许您移动、旋转、缩放和倾斜元素。把鼠标悬停在下面的元素上,可以查看 2D 转换:translate() 方法translate() 方法从其当前位置移动元素(根据为 X 轴和 Y 轴指定的参数)。下面的例子把 <div> 元素从其当前位置向右移动 50 个像素,并向下移动 100 个像素:实例div { transform: translate(50px, 100px);}rotate() 方法rotate() 方法根

2022-04-07 22:27:50 52

原创 浮动属性以及清除浮动

CSS float 属性规定元素如何浮动。CSS clear 属性规定哪些元素可以在清除的元素旁边以及在哪一侧浮动。float 属性float 属性用于定位和格式化内容,例如让图像向左浮动到容器中的文本那里。float 属性可以设置以下值之一:left - 元素浮动到其容器的左侧 right - 元素浮动在其容器的右侧 none - 元素不会浮动(将显示在文本中刚出现的位置)。默认值。 inherit - 元素继承其父级的 float 值最简单的用法是,float 属性可实现(报

2022-04-07 00:22:30 225

原创 文字渐变&over-flow属性

.box{width: 300px;height: 300px;background: linear-gradient(red,blue)position渐变方向 color1 color2不给方向 默认从上到下的顺序第一种颜色到第二种颜色依次渐变linear-gradient(color1,color2,color3...)linear-gradient(to bottom right,red,blue) 从上到下to right从左到右to right bottom..

2022-04-05 22:53:19 71

原创 css圆角、阴影及图片定位

圆角border-radius是向元素添加圆角边框。使用方法:border-radius:10px;/* 所有角都使用半径为10px的圆角 */border-radius: 5px 4px 3px 2px;/* 四个半径值分别是左上角、右上角、右下角和左下角,顺时针border-top-left-radius: top边半径 left边半径;border-top-right-radius: top边半径 right边半径;border-bottom-left-radi...

2022-04-04 22:27:26 232

原创 HTML5新增3和表单初级验证方法

email输入类型:<input type="email" name="email" /> 要求输入格式正确的 email 地址,否则浏览器不允许提交,同时会提示错误信息 url输入类型:<input type="url" /> 要求输入格式正确的 URL 地址,Opera 中会自动在开始处添加 http:// 日期时间相关输入类型:<input type="date" /><input type="time" /><input typ.

2022-04-01 23:13:40 64

原创 html5新增结构元素

.article元素(可以代表文档、页面或者是应用程序中独立、完整的、可以独自被外部引用的内容,可以是一篇博客、文章或者独立的插件,可以嵌套使用,可以用来表示插件)section元素(对于网站或应用程序中页面上的内容进行分块。一个section元素通常由 内容及 标题组成。但section元素并非是一个普通的容器元素;当一个元素需要直接被定义 样式或通过脚本定义 行为时应使用 div而非 section。)nav 元素导航区块元素,作为导航连接组使用。(导航栏、侧边导航栏等)aside 元素

2022-03-31 23:03:43 490

原创 HTML5新增部分元素

HTML 元素语法HTML 元素以开始标签起始 HTML 元素以结束标签终止 元素的内容是开始标签与结束标签之间的内容 某些 HTML 元素具有空内容(empty content) 空元素在开始标签中进行关闭(以开始标签的结束而结束) 大多数 HTML 元素可拥有属性 什么是 HTML? HTML 是用来描述网页的一种语言。 HTML 指的是超文本标记语言 (HyperTextMarkupLanguage) HTML 不是一种编程语言,而是一种标记语言(markup la...

2022-03-30 22:45:25 114

原创 盒子模型的属性

宽高width/height  在CSS中,可以对任何块级元素设置显式高度。  如果指定高度大于显示内容所需高度,多余的高度会产生一个视觉效果,就好像有额外的内边距一样;  如果指定高度小于显示内容所需高度,取决于overflow属性,需要滚动条需要设置为overflow:auto。auto  宽高和margin可以设置auto。对于块级元素来说,宽度设置为auto,则会尽可能的宽。详细来说,元素宽度=包含块宽度—元素水平外边距-元素水平边距宽度-元素水平内边距;  高度设置为aut

2022-03-30 00:25:44 412

原创 CSS盒子的属性

1. 内容区域设定(content):width:宽度的设定height:高度的设定宽度和高度的设定可以是具体的数值(带单位),也可以是百分比设置。2. 内边距(padding)的设定:盒子的内边距分为上右下左四个方向内边距的设定用来控制盒子中装载的内容到盒子边缘(边框)之间距离。盒子的内边距占据的是盒子里面的空间,最小为0,不允许出现负值。3. 外边距(margin)的设定盒子的外边距分为上右下左四个方向外边距的设定用来控制盒子外围四周的距离,不属于盒子本身范畴外边距的主要用

2022-03-28 23:01:14 1843

原创 css样式

文本对齐text-align 属性用于设置文本的水平对齐方式。文本可以左对齐或右对齐,或居中对齐。h1 { text-align: center;}h2 { text-align: left;}h3 { text-align: right;}文本方向direction 和 unicode-bidi 属性p { direction: rtl; unicode-bidi: bidi-override;}可用于更改元素的文本方向:垂

2022-03-27 21:51:11 96

原创 HTML5的字体样式设置方法

字体样式font-style 属性主要用于指定斜体文本。此属性可设置三个值:normal - 文字正常显示 italic - 文本以斜体显示 oblique - 文本为“倾斜”(倾斜与斜体非常 p.normal { font-style: normal;}p.italic { font-style: italic;}p.oblique { font-style: oblique;} 字体粗细 font-weight属性指定字体的粗细: p..

2022-03-25 16:23:12 3479

原创 CSS高级选择器

CSS高级选择器

2022-03-24 15:58:22 178

原创 css基本语法知识

style标签元素选择器div 是选择器color是属性red是 值font=size:30px; 字体大小30是像素css的最后一条声明后的:可以可不写,但是基于w3c标准规范考虑,建议最后一条的结束;都要写上Html 引入样式行为样式 :使用style属性引入样式内部样式表:css代码写在<head>的<style>标签中外部样式表<p style="color" font=>外部样式:<link rel="sty

2022-03-23 16:57:25 269

原创 表单学习表

在 实际 网页开发中通常采用post方式 提交 表单 数据输入框<lnpout type=text> value=" "type的类型 ;text、password、checkbox、radio、submit、reset、file、hidden、image和buttonvalue表示元素的初始值name=“uster”指定表单元素的名称size 表单初始的宽度输入框内 的内容是明文 密码框的内容是密文单选框<input type ="radio...

2022-03-22 16:24:18 1039

空空如也

空空如也

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

TA关注的人

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