函数的形参 —— 简单类型和复杂类型

2022-11-12
阅读 1 分钟
730
当我们把一个值类型(简单类型)变量作为参数传给函数的形参时,其实是把变量在空间里的值复制了一份给形参,在方法内部对形参做任何修改,都不会影响到外部的变量。

JS 字符串的不可变

2022-11-12
阅读 1 分钟
769
当重新给 str 赋值的时候,常量 'abc' 不会被修改,依然在内存中。给 str 赋值为 'hello' 的时候,会重新在内存中开辟空间,这个特点就是字符串的不可变。由于字符串的不可变,在大量拼接字符串的时候会有效率问题。

JavaScript 数据类型

2022-10-08
阅读 2 分钟
431
JS 把数据类型分为两类:简单数据类型( Number, String, Boolean, Undefined, Null )复杂数据类型( object )简单数据类型,是存放在栈里面,直接开辟一个空间,存放的是值。复杂数据类型,首先在栈里面存放地址(16进制),然后地址指向堆里面的数据。一、简单数据类型类型说明默认值Number数字型,包含整型、浮点型...

响应式开发

2022-08-04
阅读 1 分钟
609
响应式需要一个父级作为布局容器,通过媒体查询改变这个布局容器的大小,再改变里面子元素的排列方式和大小,从而实现不同屏幕尺寸下,看到不同的页面布局和样式变化。

rem 和 媒体查询

2022-07-30
阅读 2 分钟
1.3k
媒体查询(Media Query)是 CSS3 中的新语法,可以针对不同的媒体类型来定义不同的样式,比如 可以根据不同屏幕尺寸设置不同样式。

移动端特殊样式处理

2022-07-29
阅读 1 分钟
622
{代码...}

背景色渐变

2022-07-21
阅读 1 分钟
646
背景渐变必须添加浏览器私有属性。起始方向可以是方位名词:top 、bottom、left、right,或者是度数,缺省的话,默认为 top。

flex 布局

2022-07-21
阅读 4 分钟
667
之前的布局,依赖 display 和 position(定位)、float(浮动) 属性,但布局相对繁琐。 flex 布局(弹性布局)操作方便,布局简单,但对 PC 端的兼容性较差,在移动端开发中应用较多。

移动端布局 —— 视口

2022-07-19
阅读 1 分钟
1.8k
布局视口指网页的宽度,一般移动端浏览器都默认设置了布局视口的宽度。根据设备的不同,布局视口的默认宽度有可能是 768px、980px 或 1024px 等,主要是为了解决早期的PC端页面在手机上显示的问题。

浏览器私有前缀

2022-07-13
阅读 1 分钟
707
浏览器私有前缀是为了兼容老版本的写法,新的浏览器无需添加。1、私有前缀有哪些?-moz-:代表 firefox 浏览器私有属性-ms-:代表 ie 浏览器私有属性-webkit-:代表 Safari、Chrome 私有属性-o-:代表 Opera 私有属性2、写法 {代码...}

如何设置网页 favicon 图标

2022-07-13
阅读 1 分钟
1.3k
1、制作 favicon 图标将网站图标切成 png 图片,然后通过第三方转换网站(例如比特虫)将 png 转换为 ico 图标。2、将 favicon 图标放到网站根目录下3、在 HTML 页面中引入 favicon 图标在 html 页面里面的 <head></head> 中间引入代码: {代码...}

CSS 属性书写顺序

2022-07-13
阅读 1 分钟
864
在 CSS 属性的书写过程中,建议遵循以下顺序:1、布局定位属性dispalypositionfloatclearvisibilityoverflow2、自身属性widthheightmarginpaddingborderbackground3、文本属性colorfonttext-decorationtext-alignvertical-alignwhite-spacebreak-word4、其他属性(CSS 3)contentcursorborder-radiusbox-shadowtext-shad...

CSS 初始化

2022-07-13
阅读 1 分钟
589
不同浏览器对有些标签的默认值是不同的,为了统一效果,消除不同浏览器的差异,我们需要对 CSS 初始化,也就是重设浏览器的样式。 {代码...} {代码...} {代码...} {代码...} {代码...} {代码...} {代码...} {代码...}

CSS 中的 3D 转换

2022-07-13
阅读 2 分钟
1.2k
我们生活的环境是 3D 的,特点是近大远小,在物体后面的东西会被遮挡。我们可以用 CSS3 做出 3D 的视觉效果。1、3D 移动 —— translate3d之前我们学到的移动是二维的(2D 转换 transform —— 元素的位移、旋转、缩放),3D 移动是在此基础上多了一个移动的方向,也就是 Z 轴。 {代码...} 需要注意的是,在 X、Y 轴的移动距...

CSS3 中的动画

2022-07-11
阅读 2 分钟
587
0% 是动画的开始,100% 是动画的完成。这样的规则就是 动画序列。我们可以用多个百分比来规定变化发生的时间,比如 25%、50%等,或者用关键词 from 和 to,等同于 0% 和 100%。

2D 转换 transform —— 元素的位移、旋转、缩放

2022-07-11
阅读 2 分钟
2.2k
一、2D转换之移动 —— translatetranslate 可以改变元素在页面中的位置,类似定位,可以沿着 X 轴和 Y 轴移动元素。translate 最大的优点:不会影响到其他元素的位置。1、沿 x 轴移动 {代码...} 2、沿 y 轴移动 {代码...} 3、同时沿 x轴、 y 轴移动 {代码...} 二、2D转换之旋转 —— rotaterotate 可以让元素在二维平面内顺...

CSS3 中的过渡 —— transition

2022-07-10
阅读 1 分钟
629
在 CSS3 中,我们可以利用 transition 实现元素从一种样式变换为另一种样式时添加动画效果。 通常和 :hover 一起搭配使用。

CSS3 盒子模型

2022-07-10
阅读 1 分钟
658
在之前的盒子模型中,如果我们为盒子设置了 width、padding、border,那么盒子的实际宽度为 width + padding-left + padding-right + border-left + border-right。

伪元素选择器

2022-07-04
阅读 1 分钟
464
伪元素选择器可以帮助我们利用 CSS 创建新标签元素,而不需要 HTML 标签,简化 HTML 结构。::before 可以在元素内部的前面插入内容::after 可以在元素内部的后面插入内容before 和 after 创建的元素属于行内元素新创建的元素在文档树中是找不到的,我们称之为 伪元素before 和 after 必须有 content 属性伪元素选择器和...

结构伪类选择器

2022-07-04
阅读 2 分钟
766
结构伪类选择器主要根据文档结构来选择元素,常用于根据父级选择器选择里面的子元素。先来段 html 例子 {代码...} 1、first-child用于匹配父元素中的第一个子元素(最美四季) {代码...} 2、last-child用于匹配父元素中的最后一个子元素(冬) {代码...} 3、nth-child(n)可以选择父元素中一个或多个特定的子元素n 可以是...

属性选择器

2022-07-03
阅读 1 分钟
658
属性选择器可以根据元素特定的属性来选择元素,这样可以不用借助于“类选择器”或“id选择器”。属性选择器的权重为 10。1、选择含有某属性的元素 {代码...} 如果我想选出具有 value 属性的 input 元素,可以这么写: {代码...} 2、选择等于某属性值的元素 {代码...} 如果我想选出 input 类型为 password 的元素,可以这么写...

HTML5 中常用的新特性

2022-07-03
阅读 2 分钟
567
在上面的代码块中,包含了两个类型不同的 source,还有一行文字。如果浏览器支持 mp4 类型的文件,就可以直接播放 movie.mp4 这个视频;如果不支持,则尝试播放 ogg 类型的视频;如果这两种类型的文件都不支持,则会显示文字 “您的浏览器不支持 video 标签”。

CSS 溢出文字省略号显示

2022-06-28
阅读 1 分钟
599
1、单行文本溢出显示省略号 {代码...} 2、多行文本溢出显示省略号多行文本溢出显示省略号,有较大兼容性问题,适合于 webKit 浏览器或移动端(因为移动端大部分是 webkit 内核) {代码...}

用 CSS 画三角形

2022-06-23
阅读 1 分钟
727
网页中一些常见的三角形,可以使用 CSS 直接画出来 {代码...} 有四个三角形!如果想要其中的一个三角形,把其他 border 设为透明就好,比如我想要向右的箭头,只需要将最后两行改为: {代码...} 那能不能画个其他样式的三角形呢?比如这样:还是修改最后两行代码: {代码...} 还可以画直角三角形,只需要修改 border-wid...

vertical-align 属性

2022-06-23
阅读 1 分钟
596
图片、表单都属于行内块元素,默认的 vertical-align 是基线对齐,将属性设置为 middle,就可以让文字和图片垂直居中对齐了。

CSS 的一些技巧

2022-06-22
阅读 1 分钟
668
1、更改鼠标样式使用 cursor 属性可以修改鼠标指针的形状 {代码...} 常用属性说明示例default默认的箭头pointer小手move移动text文本not-allowed禁止2、去掉 input 表单的边框 {代码...} 3、防止拖拽文本域 {代码...}

字体图标

2022-06-22
阅读 2 分钟
531
字体图标主要应用于网站中通用、常用的一些小图标,它展示的是图标,但本质属于字体。优点:轻量级:一个图标字体要比一系列的图像小,一旦字体加载了,图标就会立马渲染出来,减少服务端请求灵活性:字体图标的本质上还是文字,可以很随意的改变颜色、产生阴影、透明效果、旋转等。兼容性:几乎支持所有的浏览器推荐下...

元素的显示与隐藏

2022-06-21
阅读 1 分钟
550
1、displaydisplay 属性用于设置一个元素应该如何显示 {代码...} display 隐藏元素后,不再占有原来的位置。2、visibilityvisibility 属性用于设置一个元素是可见还是隐藏 {代码...} visibility 隐藏元素后,继续占有原来的位置。3、overflow 溢出如果元素中内容过多,溢出了元素的框,可以用 overflow 属性指定溢出部分...

CSS 定位补充

2022-06-21
阅读 1 分钟
538
绝对定位/固定定位的盒子会完全压住下面的盒子,而浮动元素只会压住它后面标准流的盒子,而不会压住盒子里面的文字或图片,因为浮动最初产生的目的就是为了做文字环绕的效果。

如何让定位的盒子居中

2022-06-21
阅读 1 分钟
938
普通块元素的盒子可以通过设置 margin:0 auto 来水平居中,但对加了绝对定位的盒子,这种方式是无效的。要让绝对定位的盒子水平居中,可以这么做: {代码...} 同理,垂直居中这么做: {代码...}