随笔分类 - web前端
摘要：
web前端JavaScript交互 点击事件 意义： JavaScript中的点击事件是指当用户在页面上点击某个元素时触发的事件。这个事件可以用于执行各种操作，如改变元素的样式、修改页面内容等。这是Web应用程序中最常用 的交互方式之一，允许用户与网页进行交互，提高用户体验。 案例： 随机点名器 知
阅读全文
web前端JavaScript交互 点击事件 意义： JavaScript中的点击事件是指当用户在页面上点击某个元素时触发的事件。这个事件可以用于执行各种操作，如改变元素的样式、修改页面内容等。这是Web应用程序中最常用 的交互方式之一，允许用户与网页进行交互，提高用户体验。 案例： 随机点名器 知
阅读全文
摘要：
1、flex弹性布局 设置方式：给父元素设置 display: flex，子元素可以自动挤压或拉伸 组成部分： 弹性容器 弹性盒子 主轴：默认在水平方向 侧轴 / 交叉轴：默认在垂直方向 例如： 2、主轴对齐方式 属性名：justify-content 属性值 效果 flex-start 默认值，弹
阅读全文
1、flex弹性布局 设置方式：给父元素设置 display: flex，子元素可以自动挤压或拉伸 组成部分： 弹性容器 弹性盒子 主轴：默认在水平方向 侧轴 / 交叉轴：默认在垂直方向 例如： 2、主轴对齐方式 属性名：justify-content 属性值 效果 flex-start 默认值，弹
阅读全文
摘要：
1、动画说明 目标：使用animation添加动画效果 思考：过渡可以实现什么效果？ 答：实现2个状态间的变化过程 动画效果：实现多个状态间的变化过程，动画过程可控（重复播放、最终画面、是否暂停） 动画的本质是快速切换大量图片时在人脑中形成的具有连续性的画面 构成动画的最小单元： ：帧或动画帧 2、
阅读全文
1、动画说明 目标：使用animation添加动画效果 思考：过渡可以实现什么效果？ 答：实现2个状态间的变化过程 动画效果：实现多个状态间的变化过程，动画过程可控（重复播放、最终画面、是否暂停） 动画的本质是快速切换大量图片时在人脑中形成的具有连续性的画面 构成动画的最小单元： ：帧或动画帧 2、
阅读全文
摘要：
1、认识3D转换 近大远小 近实远虚 物体和面遮挡不可见 2、三维坐标系 x 轴：水平向右 -- 注意：x 轴右边是正值，左边是负值 y 轴：垂直向下 -- 注意：y 轴下面是正值，上面是负值 z 轴：垂直屏幕 -- 注意：往外边的是正值，往里面的是负值 3、3D转换 3D 转换知识要点 3D 位移
阅读全文
1、认识3D转换 近大远小 近实远虚 物体和面遮挡不可见 2、三维坐标系 x 轴：水平向右 -- 注意：x 轴右边是正值，左边是负值 y 轴：垂直向下 -- 注意：y 轴下面是正值，上面是负值 z 轴：垂直屏幕 -- 注意：往外边的是正值，往里面的是负值 3、3D转换 3D 转换知识要点 3D 位移
阅读全文
摘要：
平面转换 transform 作用：为元素添加动态效果，一般与过渡配合使用 概念：改变盒子在平面内的形态（位移、旋转、缩放、倾斜） 平面转换又叫 2D 转换 1、平面转换 平移 目标：使用translate实现元素位移效果 语法 transform: translate(水平移动距离, 垂直移动距离
阅读全文
平面转换 transform 作用：为元素添加动态效果，一般与过渡配合使用 概念：改变盒子在平面内的形态（位移、旋转、缩放、倾斜） 平面转换又叫 2D 转换 1、平面转换 平移 目标：使用translate实现元素位移效果 语法 transform: translate(水平移动距离, 垂直移动距离
阅读全文
摘要：
1、相对定位 position: relative 特点： 不脱标，占用自己原来位置 显示模式特点保持不变 设置边偏移则相对自己原来位置移动 拓展：很少单独使用相对定位，一般是与其他定位方式配合使用 参考自身原位置 2、绝对定位 position: absolute 使用场景：子级绝对定位，父级相对
阅读全文
1、相对定位 position: relative 特点： 不脱标，占用自己原来位置 显示模式特点保持不变 设置边偏移则相对自己原来位置移动 拓展：很少单独使用相对定位，一般是与其他定位方式配合使用 参考自身原位置 2、绝对定位 position: absolute 使用场景：子级绝对定位，父级相对
阅读全文
摘要：
1、图文对齐（搜索框） 图片标签是典型的行内块元素 除此之外行内块元素还有表单元素input、button （行内块元素既可以设置宽高又可以和行元素在一行 行内块的转换问题 display （block块、inline行、inline-block行内块、none隐藏 转换后两个块中间存在空隙问题 2
阅读全文
1、图文对齐（搜索框） 图片标签是典型的行内块元素 除此之外行内块元素还有表单元素input、button （行内块元素既可以设置宽高又可以和行元素在一行 行内块的转换问题 display （block块、inline行、inline-block行内块、none隐藏 转换后两个块中间存在空隙问题 2
阅读全文
摘要：
1.音频 2.视频 视频，音频通用标签： <object src="视频/音频" ></object> <embed src="音频/视频" ></embed> 3.有序无序列表 有序列表：ol>li ol内必须是li,li内没限制 无序列表：ul>li ul内必须是li,li内没限制 4.表格 t
阅读全文
1.音频 2.视频 视频，音频通用标签： <object src="视频/音频" ></object> <embed src="音频/视频" ></embed> 3.有序无序列表 有序列表：ol>li ol内必须是li,li内没限制 无序列表：ul>li ul内必须是li,li内没限制 4.表格 t
阅读全文
摘要：
html和css的关系： HTML（HyperText Markup Language，超文本标记语言）是用于创建网页的标准标记语言。它负责定义网页的结构和内容。HTML使用各种标签来包含文本、链接、图 片、视频等元素，并可以与如JavaScript等其他技术结合使用，实现网页的动态功能。 CSS
阅读全文
html和css的关系： HTML（HyperText Markup Language，超文本标记语言）是用于创建网页的标准标记语言。它负责定义网页的结构和内容。HTML使用各种标签来包含文本、链接、图 片、视频等元素，并可以与如JavaScript等其他技术结合使用，实现网页的动态功能。 CSS
阅读全文
摘要：
vscode 编译器下载地址: https://code.visualstudio.com/ 1、下载完vscode后安装的三个小插件：chinese（中文）、live serve、会了吧（翻译） 2、每个打开的网络页面都有html编码，可以进行编码查询和编码检查 3、vscode的三种创建编码文件
阅读全文
vscode 编译器下载地址: https://code.visualstudio.com/ 1、下载完vscode后安装的三个小插件：chinese（中文）、live serve、会了吧（翻译） 2、每个打开的网络页面都有html编码，可以进行编码查询和编码检查 3、vscode的三种创建编码文件
阅读全文
