12 2021 档案
摘要:if语句 流程控制语句 JS中的程序是从上到下一行一行执行的 通过流程控制语句可以控制程序执行流程, 使程序可以根据一定的条件来选择执行 语句的分类: 1.条件判断语句 2.条件分支语句 3.循环语句 条件判断语句: 使用条件判断语句可以在执行某个语句之前进行判断, 如果条件成立才会执行语句,条件不
阅读全文
摘要:表格 在现实生活中,我们经常需要使用表格来表示一些格式化数据: 课程表、人名单、成绩单.... 同样在网页中我们也需要使用表格,我们通过table标签来创建一个表格 <body> <table border="1" width='50%' align="center"> <tr> <td>A1</t
阅读全文
摘要:一元运算符 一元运算符,只需要一个操作数 “+” 正号 正号不会对数字产生任何影响 “-” 负号 负号可以对数字进行负号的取反 对于非Number类型的值, 它会将先转换为Number,然后在运算 可以对一个其他的数据类型使用“+”,来将其转换为Number 它的原理和Number()函数一样 va
阅读全文
摘要:运算符也叫操作符 通过运算符可以对一个或多个值进行运算,并获取运算结果 比如: typeof就是运算符,可以来获得一个值的类型 它会将该值的类型以字符串的形式返回 number string boolean undefined object #算数运算符: +,-,*,/,%; 当对非Number类
阅读全文
摘要:强制类型转换 指将一个数据类型强制转换为其他的数据类型 类型转换主要指,将其他的数据类型,转换为 string Number Boolean 将其他的数据类型转换为String 方式一: 调用被转换数据类型的toString()方法 该方法不会影响到原变量,它会将转换的结果返回 但是注意:null和
阅读全文
摘要:JavaScript 学习JS前掌握的三个常用语 控制浏览器弹出一个警告框 alert(" "); 让计算机在页面中输出一个内容 document.write()可以向body中输出一个内容 document.write(" " ); 向控制台输出一个内容 console.log()的作用是向控制台
阅读全文
摘要:像素 屏幕是由一个一个发光的小点构成,这一个个的小点就是像素 分辨率:1920 x 1080说的就是屏幕中小点的数量 在前端开发中像素要分成两种情况讨论:CSS像素和物理像素 物理像素,上述所说的小点点就属于物理像素 CSS像素,编写网页时,我们所用像素都是CSS像素 浏览器在显示网页时,需要将CS
阅读全文
摘要:弹性盒子 flex(弹性盒、伸缩盒) 是CSS中的又一种布局手段,它主要用来代替浮动来完成页面的布局 flex可以使元素具有弹性,让元素可以跟随页面的大小的改变而改变 弹性容器 要使用弹性盒,必须先将一个元素设置为弹性容器-我们通过display 来设置弹性容器 display:flex 设置为块级
阅读全文
摘要:#less less是一门css的预处理语言 less是一个css的增强版,通过less可以编写更少的代码实现更强大的样式 在less中添加了许多的新特性:像对变量的支持、对mixin的支持... ... less的语法大体上和css语法一致,但是less中增添了许多对css的扩展, 所以浏览器无法
阅读全文
摘要:变形就是指通过css来改变元素的形状或位置 变形不会影响到页面的布局 transform用来设置元素的变形效果 平移: translateX() 沿着x轴方向平移 translateY() 沿着y轴方向平移 translateZ() 沿着z轴方向平移 旋转:通过旋转可以使元素沿着xy或z旋转指定的角
阅读全文
摘要:过渡(transition) 通过过渡可以指定一个属性发生变化时的切换方式 transition-property:指定要执行过渡的属性 多个属性间使用,隔开 如果所有属性都需要过渡,则使用all关键字 大部分属性都支持过渡效果,注意过渡时必须是从一个有效数值向另外一个有效数值进行过渡 transi
阅读全文
摘要:表单 在现实生活中表单用于提交数据 在网页中也可以使用表单,网页中的表单用于将本地的数据提交给远程的服务器 使用form标签来创建一个 表单 form的属性 action表单要提交的服务器的地址 文本框 注意:数据要提交到服务器中,必须要为元素指定个name属性值 单选按钮 像这种选择框,必须要指定
阅读全文
摘要:背景 background-image设置背景图片 可以同时设置背景图片和背景颜色,这样背景颜色将会成为图片的背景色 如果背景的图片小于元素,则背景图片会自动在元素中平铺将元素铺满 如果背景的图片大于元素,将会-个部分背 景无法完全 显示 如果背景图片和元素一样大,则会直接正常显示 backgrou
阅读全文
摘要:字体族和行高 字体相关的样式 color用来设置字体颜色 font-size字体的大小 和font -size相关的单位 em 相当于当前元素的一个font-size rem 相对于根元素的一个font-size font- family字体族(字体的格式) 可选值: serif 衬线字体 sans
阅读全文
摘要:Font Awesome使用方法 fontawesome使用步骤 1.下载https://fontawesome.com/ 2.解压 3.将css和webfonts移动到项目中 4.将all.css引入到网页中 5.使用图标字体 直接通过类名来使用图标字体 class="fas fa-bell" c
阅读全文
摘要:z-index元素层级解析 关于元素定位可以参照前文:https://www.cnblogs.com/wzx-blog/p/15659373.html 对于开启了定位元素; 可以通过z- index属性来指定元素的层级 z-index需要一个整数作为参数,值越大元素的层级越高 元素的层级越高越优先显
阅读全文
摘要:元素定位 定位(position) 定位是一种更加高级的布局手段 通过定位可以将元素摆放到页面的任意位置 使用position属性来设置定位 可选值: static 默认值,元素是静止的没有开启定位 relative 开启元素的相对定位 absolute 开启元素的绝对定位 fixed 开启元素的固
阅读全文
摘要:页面布局及常见问题 浮动简介 通过浮动可以使一个元素向其父元素的左侧或右侧移动 使用float 属性来设置于元素的浮动 可选值: none 默认值,元素不浮动 left; 元素向左浮动 right; 元素向右浮动 注意,元素设置浮动以后,水平布局的等式便不需要强制成立 元素设置浮动以后,会完全从文档
阅读全文
摘要:盒子外观 盒子大小 默认情况下,盒子可见框的大小由内容区、内边距和边框共同决定 box-sizing用来设置盒子尺寸的计算方式( 设置width和height的作用) 可选值: content-box默认值,宽度和高度用来设置内容区的大小 border-box宽度和高度用来设置整个盒子可见框的大小
阅读全文
摘要:卡片透明化 backdrop-filter:blur(50px) 浮动图像周围弯曲文本 .any-shape{ width:300px; float:left; shape-outside:circle(50%); } 布局初始化 *{ padding:0; margin:0; max-width:
阅读全文