web前端基础
关注
分享
扫一扫
文章平均质量分 87
大脸胖柴
这个作者很懒，什么都没留下…
展开
-
字符串对象——字符串常用知识集合
目录创建字符串方法第一种方法：构造函数来创建String对象第二种方法：字面量方法来创建字符串对象字符串方法取字符串的长度通过length来获取字符串的长度查找字符串1、indexOf()2、lastIndexOf(参数1 ，参数2) ;返回字符串中子字符串最后出现的位置3、search 检索字符串中指定的子字符串4、charAt() 返回指定位置的字符5、includes(子串) 查找字符串中是否包含指定的字符串6、match(参数)在字符...原创 2022-04-14 00:32:37 · 1580 阅读 · 0 评论 -
JavaScript预编译
在JavaScript中存在一种预编译的机制，这也是Java等一些语言中没有的特性，也就正是因为这个预编译的机制，导致了js中变量提升的一些问题，下面这两句话能解决开发当中一部份问题，但不能解决所有问题，还有一些问题是你必须通过学习预编译才能解决的。函数声明整体提升（函数定义会提升，传参也会提升。） 变量声明提升（*注意预编译时，变量声明会提升，但变量赋值不会提升。）预编译阶段发生变量声明和函数声明，没有初始化行为（赋值），匿名函数不参与预编译 。只有在解释执行阶段才会进行变量初始化 。ti原创 2022-04-07 23:33:24 · 575 阅读 · 0 评论 -
JavaScript——数学对象、DOM对象对象的常用方法
1、数学对象Math.PI 圆周率 π Math.ceil() 向上取整 返回的是大于或等于函数参数，并且与之最接近的整数 Math.floor() 向下取整 返回的是小于或等于函数参数，并且与之最接近的整数 Math.round(num) 返回与num最接近的整数(四舍五入) Math.max(x,y) 返回指定的数中带有较大的值的那个数 Math.min(x,y) 返回指定的数字中带有最小值的数字 Math.abs(x) 返回...原创 2022-04-07 23:27:21 · 640 阅读 · 0 评论 -
JavaScript基础——switch结构( switch和多重if结构区别)、 while循环、 do-while循环、for循环
1、switch结构switch (表达式){ case 常量 1: 语句; break; case 常量 2: 语句; break; default: 语句;} 例子：请根据用户输入的数字判断菜单 <script> var a = prompt("今天是周几,看看中午吃啥子", "原创 2022-03-31 22:46:53 · 2743 阅读 · 0 评论 -
检测数据类型、小数点后保留后N位方法、数据类型转换、window对象的方法 、分支结构 （if单分支、if-else 双分支、多重if结构）isNaN() 与 Number.isN的区别
1、检测数据类型（typeof）var a="hello";console.log(typeof a);或者var a="hello";console.log typeof (a);2、数据类型转换其他类型转换为字符串类型1、通过运算 var a=10; a=a+""; 2、通过方法 var a=10; a=String(a);其他类型转（字符串）换为数字类型1、通过运算 var a="10";原创 2022-03-30 21:55:00 · 307 阅读 · 0 评论 -
Javascript运算符——算术运算符、三元运算符、自增 与 自减、比较运算符、逻辑运算符、= 与== 与 === 的区别
1、算术运算符1. 加号 +加号两侧同时为数字，进行加法运算加号两侧任何一侧为字符串，表示字符拼接 （符号两侧要用空格隔开）（其余相同）2.减号 - 3.乘号 * 4.除号 /5.取余 %在进行减 乘 除 取余运算时：符号两侧同时为数字进行对应的算术运算，若其中有一侧为非数字，则运算时会把该侧转换为数字，转换成功，进行对应的算术运算，转换失败，得到NaN(Not a Number非数字) <scrip......原创 2022-03-29 23:40:27 · 1563 阅读 · 0 评论 -
弹性盒子的布局运用
弹性盒子——传统布局——基于盒子模型，依赖 display 属性、position属性、float属性。它对于那些特殊布局非常不方便，比如，垂直居中就不容易实现。并且，传统布局代码冗长，出错率高，要时刻注意清除浮动或者在进行绝对定位时给父元素添加相对定位。否则就容易造成页面布局混乱。Flex布局可以避免这种情况：Flex是Flexible Box的缩写，意为”弹性布局”，用来为盒状模型提供最大的灵活性。......原创 2022-03-23 19:38:50 · 2168 阅读 · 0 评论 -
使用columns简单实现瀑布流、分栏、自适应布局和响应式布局、媒体查询、单位（px em rem）的区别、VW与VH介绍、vw/vh和百分比%的区别、怪异盒子模型——移动端入门知识点
一、分栏1、列宽度语法：column-widthcolumn-width: 200px;/* 栏宽 列宽 */2、列数语法：column-countcolumn-count: 4;/*栏数 列数 */3、列间距语法：column-gap column-gap: 20px; /* 列间距 */4、列样式（边框）语法：column-rulecolumn-rule: 1px dotted pink;原创 2022-03-21 23:14:59 · 1996 阅读 · 0 评论 -
移动、旋转 、缩放、扭曲 、变换基点 、CSS3新增动画效果、菜单进度条制作
目录一、变换transform1.移动 translate2.旋转 rotate3.缩放 scale4.扭曲 skew5.变换基点 transform-origin6.transform 缩写二、动画1.基本形式2.属性值3.实例一、变换transform1.移动 translate（1）基本形式在水平和垂直方向上的移动，有以下形式 translateX(数值+单位) 水平移动 translate...原创 2022-03-17 23:54:50 · 1583 阅读 · 0 评论 -
自定义字体样式引入使用方法、文本阴影、边框阴影、（边框）圆角、渐变、理解重绘与回流、渐进增强和优雅降级的区别
自定义字体样式方法文件层级关系：引入与使用方法举例：<!DOCTYPE html><html> <head> <meta charset="utf-8"> <title>字体练习</title> <style type="text/css"> /* 字体存放文件命名应为fonts */ /* 引入字体标签 */ @font-face { font-family: ".原创 2022-03-16 21:48:16 · 719 阅读 · 0 评论 -
css3新增选择器、伪元素、隐藏元素的方法、visibility: hidden与display：none；的区别 、遮罩层效果、 三级菜单制作、选项卡制作——css3知识点总结
一、css3新增选择器1、兄弟选择器相邻兄弟选择器E + F { }紧挨选择器E后的那个兄弟选择器F /* 相邻兄弟选择器，该代码意思是选择紧邻div后的那一个span元素，且只有第一个span会被选中。 */ div+span{ color: pink; }通用兄弟选择器E ~ F{ }选择器E后的所有的兄弟选择器F/* 通用兄弟选择器，选择所有div元素后面的span元素 */ /* 一对.原创 2022-03-15 23:48:08 · 2603 阅读 · 0 评论 -
html5-语义化标签、表单控件、多媒体控件
一、html5是什么1. HTML5 是最新的 HTML 标准。2. HTML5 是专门为承载丰富的 web 内容而设计的，并且无需额外插件。3. HTML5 拥有新的语义、图形以及多媒体元素。4. HTML5 提供的新元素和新的 API 简化了 web 应用程序的搭建。5. HTML5 是跨平台的，被设计为在不同类型的硬件（PC、平板、手机、电视机等等）之上运行。二、新增语义化标签html5中新增的语义化标签可以分为两大类：块元素标签和内联元素标签。1.块元素标签..原创 2022-03-14 22:00:21 · 1095 阅读 · 0 评论 -
盒子模型——网页布局、定位、光标样式、pointer-event无视元素遮挡、背景不透明度、格式化列表（ul、ol）样式
前言：网页布局常用到定位，并且与浮动等内容结合使用定位简单概述：定位=定位模式+边偏移将盒子定在某一个位置，所以定位也是在摆放盒子，按照定位的方式移动盒子定位模式用于指定一个元素在文档中的定位方式，边偏移则决定了该元素最终位置浮动和定位的区别：1.浮动可以让多个块级盒子一行没有缝隙排列显示，经常用于横向排列盒子2.定位则是可以让盒子自由的在某个盒子内移动位置或者固定在屏幕中某个位置，并且可以压住其他盒子边偏移：边偏移就是定位的盒子移动到最终位置t.原创 2022-03-11 00:22:25 · 1874 阅读 · 0 评论 -
盒子模型——网页布局、浮动、如何开启BFC
前述：传统网页布局的三种方式：网页布局的本质----用css来摆放盒子，把盒子摆到相应位置css提供了三种传统布局方式（简单易懂就是盒子如何进行排列顺序）：标准流（普通流/文档流） 浮动 定位一、标准流（普通流/文档流）所谓的标准流：就是标签按照规定好默认方式排列二、浮动 float : left 左浮动float ：right 右浮动 float : none 默认 不浮动1.浮动元素会脱离标准流（脱标）脱离标准流的控制（浮）移动到......原创 2022-03-10 23:46:11 · 1027 阅读 · 1 评论 -
CSS背景图片与CSS精灵
一、背景颜色1、background-color 属性指定元素的背景色。body { background-color: blue;} /*为页面指定一个蓝色背景*/二、background-image 背景图片1.给页面添加图片背景值：url（"图片路径"）background-image: url(图片路径.jpg);也可以同时添加多张图片：background-image: url(图片1.jpg),url(图片2.jpg)，...;2.b原创 2022-03-07 23:55:46 · 847 阅读 · 0 评论 -
盒子模型（ 溢出显示处理）、盒子边框（边框样式）、伪类、文本样式——CSS知识点
一、文本相关样式1. 文本水平对齐方式text-align 文本水平对齐方式 left （默认） 左对齐（默认） right 右对齐 center 居中对齐 justify 两端对齐 2.首行缩进text-indent首行缩进 值：数值+单位 常用em作为单位 3.文本修饰text-decoration 文本修饰 none 无修饰 underline 下划线 line-t......原创 2022-03-03 21:42:51 · 392 阅读 · 1 评论 -
CSS引入方式、选择器、文字样式、href与src区别、link与@import引入css文件用法区别、display属性操作 ——初学CSS知识总结
一.CSS是什么？CSS(Cascading Style Sheets)，层叠样式表。二.css引入方式三种方式优先级：行内样式最大，其余两种最后引入，优先级最高。1.行内样式 直接在开始标签上加style属性来控制样式 例如：<div style="color:red;">内容</div> 2.内嵌式所有的样式都写到一个<style></style>内部，该标签放<head>.........原创 2022-03-02 21:53:56 · 1421 阅读 · 0 评论 -
HTML全部知识点总结——思维导图（请自行放大查看）
readonly="readonly"—只读文本不可修改在<input type=" ">中使用移动电话： <input type="text" name="yddh" value="13603430739" readonly="readonly" /> <span style="color: red;">手机号不可修改</span>效果：disabled不可用状态<input type="submit" ...原创 2022-03-01 16:35:53 · 2316 阅读 · 2 评论 -
HTML——表单知识点总结
表单标签：这里面包含了处理表单数据所用程序的URL以及数据提交到服务器的方法。表单域：包含了文本框、密码框、隐藏域、多行文本框、复选框、单选框、下拉选择框和文件上传框等。表单按钮：包括提交按钮、复位按钮和一般按钮。原创 2022-02-25 21:59:54 · 2502 阅读 · 0 评论 -
HTML—— 超链接 行内框架 表格 知识总结。
一、超链接1. 简述HTML 使用超级链接与网络上的另一个文档相连。几乎可以在所有的网页中找到链接。点击链接可以从一张页面跳转到另一张页面。超链接可以是一个字，一个词，或者一组词，也可以是一幅图像，您可以点击这些内容来跳转到新的文档或者当前文档中的某个部分。当您把鼠标指针移动到网页中的某个链接上时，箭头会变为一只小手。我们通过使用 <a> 标签在 HTML 中创建链接2. 举例<a href="" target=""> 超链接</a>实例..原创 2022-02-24 21:43:12 · 4598 阅读 · 0 评论 -
HTML知识总结——常用标签、特殊符号、行内元素、块元素、有序列表与无序列表
html知识点总结原创 2022-02-23 21:40:40 · 832 阅读 · 0 评论 -
html5是什么？五大浏览器、网页基本骨架结构与含义、常用标签——学习HTML5第一天的心得总结，若有错误望指正，我将持续更新与大家共同进步。
1.html是什么？HyperText Markup Language 超文本标记语言2.五大浏览器IE（Internet Explore）浏览器 、Opera浏览器： 、Safari浏览器： 、Firefox浏览器： 、Chrome浏览器：3.标签语法1.双标记标签 <标签名>内容</标签名>2.单标记标签 <标签名>4.网页基本骨架结构与解释<!DOCTYPE html> 声明文档类型 html5文档...原创 2022-02-22 20:32:17 · 4182 阅读 · 1 评论