自定义博客皮肤VIP专享

*博客头图:

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

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

博客底图:

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

栏目图:

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

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(23)
  • 资源 (1)
  • 收藏
  • 关注

原创 JavaScript-Dom的操作

一、查看节点 1.查看元素节点 节点类型 返回值 元素节点 1 属性节点 2 文本节点 3 我们在进行判断节点类型时需要根据返回值进行判断,用来进行判断的语法: console.log(dom对象.nodeType); 获取节点的名称: console.log(a.nodeName); 获取节点的值: console.log(a.nodeValue); 二、根据父节点查找子节点 通过父节点对象查找子节点对象 缺点:可能会有文本节点;优点: 兼容性较.

2022-04-24 23:17:50 1433

原创 字符串对象

一、创建String对象 var str = new String(); 这是我们创建的一个实例化字符串对象

2022-04-13 23:53:06 1223

原创 JavaScript入门知识点5

从上篇文章我们学习了if语句和switch语句,接下来我们一起来学习循环,循环在我们的生活中处处可见,比如我们每天作息,上班的时间等等特别多。下面就让我们学习JavaScript里的循环吧。 一、while循环 在我们学习代码之前我们先看一下它的流程图: 从上方的流程图我们可以了解到while循环有一个特点是:先判断,再执行。 语法结构: 语法结构 while(循环条件){ 循环操作;

2022-04-07 20:51:50 1136

原创 JavaScript入门知识点(4)

课前回顾 什么是变量?变量命名有哪些规则? 数据类型都分为哪几种? 运算符分为几种?分别是什么? Window对象的方法介绍了几种了?都是哪几种? 同学们如果记得不牢固的话可以回顾一下上篇文章哦? ...

2022-04-04 10:44:08 976

原创 JavaScript的入门知识点(3)

一、比较运算符 比较操作符:大于>、小于< 小于等于<= 大于等于>= 等于== 不等于!= 比较操作符返回的是布尔值: alert("2<4");//返回true alert("2>4");//返回false alert("2<=4");//返回true alert("2==2");//返回true alert("2!=2");//返回false 二、逻辑运算符 逻辑运算符有这三种:逻辑与(&&) 逻辑或(||) 逻辑非( ! )

2022-03-30 22:52:57 1164

原创 JavaScript的入门知识点(2)

一、变量的声明 1.变量声明 我们在日常的生活中用盒子装东西时,要先找到盒子,这个过程我们再编程中就称为声明变量。 2.声明变量的语法: var 变量名; 例如: var a ;这就是定义了一个变量,变量的名字是a; var able1,able2; 有的时候我们为了方便可一次性声明多个变量两个变量之间用逗号隔开 注意:变量也可以不声明,之间使用,但为了规范,需要先声明后使用。 3.初始化变量 在定义变量的时候,就给其值 例如: var a = 10 ;这就是初始化变量a 就是把1

2022-03-29 23:24:13 1465

原创 JavaScript的入门知识点(1)

一、什么是JavaScript? JavaScript是一种基于对象和事件驱动并具有相对安全性的客户端脚本语言。它是一种广泛用于客户端Web开发的脚本语言,常常用来HTML网页添加动态功能。

2022-03-28 23:37:04 957

原创 移动端入门知识(4)

上篇文章我们介绍了容器的属性,这篇我们来介绍一下项目的属性。 项目的属性有以下6种: align-self order flex-grow flex-shrink flex-basis flex 一、align-self 的属性 align-self是用来定义单个项目在交叉轴上的对齐方式,它允许单个项目与其他项目在对齐方式上不同,可覆盖align-items的属性值。 auto(默认值) 继承父容器的属性值,若没有父容器,就等同与stretch。 flex-start 居上

2022-03-24 20:12:11 552

原创 移动端入门知识(3)

flex布局 flex即Flexible Box,其含义就是弹性盒子,简称”容器”。它的所有子元素自动成为容器成员,称为Flex项目,主要用来为盒状模型提供最大的灵活性。容器默认存在两个根轴:主轴和交叉轴 注意:任何一个容器都可以定义为弹性盒子! 语法:display:flex; 注意:Webkit内核的浏览器,必须加上-webkit前缀。 一、flex-direction的属性 flex-direction属性决定主轴的方向(也可称之为排列顺序),它有以下4个值: row(默认值)

2022-03-23 20:36:56 263

原创 HTML5及CSS3的部分知识点回顾

1.新增form表单: <input type=“email”> 邮箱 <input type=“number”> 数字 <input type=“tel”> 手机 <input type=“search”> 搜索域 <input type=“url”> 网址 <input type=“date”> 年月日 <input type=“month”> 年月 <input type=“week”>

2022-03-23 13:59:18 461

原创 移动端入门知识(2)

一、单位(续集) 我们大家都知道盒子的宽度可以设置为100%,并且会生效;如果我们高度设置为100%会生效吗?这个我们大家可以去尝试一下,答案是不能的。 想把盒子的高度设置为100%有两种方法: 1.就要用绝对定位和固定定位中的一个 position: fixed; /* position: absolute; */ width: 100%; height: 100%; 2.用vw和vh单位 width: 100vw; height: 100vh; 下面就让我来介绍一下vw和vh吧!

2022-03-23 12:39:20 510

原创 移动端前言

一、CSS3新增样式 分栏的列数: 语法:column-count: 4; 分栏的宽度: 语法:column-width: 200px; 分栏的宽度和列数的缩写: columns: width 5; 注意:缩写时先写宽度,再写列数,宽度和列数之间用空格隔开即可。 分栏与分栏之间的距离: 语法:column-gap: 40px; 案例: column-count: 4; column-width: 200px; /* columns: 2

2022-03-21 20:11:29 278

原创 visibility:hidden;与display:none;的区别和渐进增强与优雅降级的区别

1.作用不同 visibility:hidden; 将元素隐藏,但是在网页中的位置不会被取缔。 display:none; 将元素的显示设为无,在网页中不占任何位置。 2.定义不同 visibility 属性指定一个元素是否可见的 display 这个属性用于定义建立布局时元素生成的显示框类型 visibility:hidden;会触发重绘(repaint) display:none;会触发回流(reflow) 重绘不一定回流,回流一...

2022-03-16 20:54:22 1974

原创 HTML5新增标签

HTML5是一个新的网络标准,现在仍处于发展阶段。目标是取代现有的HTML4.01和XHTML1.0 标准。它希望能够减少互联网富应用(RIA)对Flash、Silverlight、JavaFX等的依赖,并且提供更多能有效增强网络应用的API。 ...

2022-03-15 23:49:11 1744

原创 第二讲、盒子模型(02)

5.背景 1.背景颜色 语法:background-color: ; background-color的值可以是颜色的单词、十六进制色号(常用)、十六进制的缩写、rgba()。 其中颜色单词的值兼容性比较差,常用的是十六进制。 例如: 2.背景图片 语法:background-image:url(); 其中url是图片的路径 关于设置图片的值: background-image:url() url(); 表示双重背景 当背景过小时我们会发现图片会铺满屏幕,其默认的值是rep

2022-03-14 21:53:24 390

原创 第二讲、盒子模型(01)

一、盒子模型的大小 1.width和height width 盒子模型的宽度 height 盒子模型的高度 注意:width和height 只定义盒子的大小,不包含边框和边距 如果内容太多,超过了width和height,则默认情况下将忽略width和height的设置 二、盒子模型的边框 1.边框的三大方面 border-width border-color border-style 边框的宽度 边框的颜色 ...

2022-03-11 23:33:35 1010

原创 第一讲、css语法、文本(3)

同学们,我们接着上篇博客继续学习! 7.英文字母大小写转换 语法:text-transform capitalize 单词首字母大写 uppercase 全部大写 lowercase 全部小写 案例: 8.文本的装饰效果 语法:text-decoration underline 文字加下划线 line-through 文字加删除线 overline 文字加上划线 案例: 9.段落内容首行缩进(悬挂缩进) 语法:t.

2022-03-08 15:20:57 135

原创 第一讲 css语法、文本(02)

一、css选择器 css修饰html标签的基础就是选择符,即可以通过多种选择符来选择要修饰的html标签 权重:可理解为优先级,优先级高则会覆盖优先级低的样式。 1、通配选择器 通配选择器即所有的标签 语法:*{规则} 例如: 通配选择器的权重非常小 2、类型(标签)选择器 类选择器就是使用标签的名字作为选择符 也可称之为标签选择器 语法: .类名{规则 } 例如: 3、ID选择器 每个html标签的id都是不一样的,因此ID选择器的权重比较大。切记i

2022-03-05 16:15:21 363 2

原创 第一讲 css语法、文本(01)

同学们,HTML学完了接下来我们来学习CSS,CSS是 一、css css 层叠样式(Cascading Style Sheets) 优点: 1.使HTML专注于网页的内容,css专注于网页的表现 2.提供了丰富的格式化功能 3.可以针对各种可视化浏览器(主要有显示器、打印机、PDA等)来设置不同的样式 ...

2022-03-05 11:58:27 521

原创 html基础知识04

元素分类 块元素(display:block) <p></p> <h1></h1>~<h6></h6> <ul></ul> <ol></ol> <hr> <div></div> <form></form> 行内元素(display:inline) <span></span> <.

2022-03-03 21:51:30 281

原创 HTML基础知识03

表单 1.表示采集数据范围 1>基本结构 <form action=""method=""></form> 2>form的属性 action 数据提交的地址 method 数据提交的方式 method的方式有get和post两种 method提交方式区别: 1:get方式提交的数据会出现在地址栏上方,安全性较低 2.get方法可能获取的数据是...

2022-03-03 13:03:03 452

原创 HTML基础知识02

水平线 <hr width="" align=""color=""> width 宽度 align 水平方向对齐方式 center 居中对齐 left 居左对齐 right 居右对齐 color 修改水平线的颜色 表现性元素 1.加粗 <b>内容</b> <strong>内容</strong> 主旨表强调 2.倾斜 <i>内容</i&gt...

2022-03-02 15:00:13 354

原创 HTML基础知识01

<DOCTYPE html> 定义文档的类型 html5 的文档 DOC document文档 type 类型 html 超文本标记语言 五大浏览器: IE firefox chrome(谷歌) opera(欧鹏) safari(苹果浏览器) <meta charset="utf-8">声明编码,否则会出现乱码 <title>内容</title> 内容是网页标签标题 执行代码结果: 标签分类: 1.双标记标签:<p>...&l

2022-03-01 15:26:38 310

背景图片粘性定位案例图

其中含有粘性定位和锚点等

2022-03-14

空空如也

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

TA关注的人

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