案例验证的浏览器为 - Google Chrome 版本 119.0.6045.123（正式版本）（arm64）
可以从这个方法中获取到了小红块的拖动偏移量left，那么只要通过这个left进行计算，将计算的值赋值给右边的数字之中。
当时答应的很愉快，但是却是立了一个Flag，后半个月忙得不可开交，直到今天小伙伴又来问我，我才想起Flag还没拔 :$(发呆)
Hello小伙伴们大家好，这周事情有点多，没有及时更新，就请大家原谅兔妞吧，真的是作息紊乱，还心累，，，呜呜，，，苍天啊，大地啊，兔妞是多么的想更新啊。那么今天就来给大家带来新的题目啦！今天的题目主要集中在CSS上，曾经的我以为CSS是辣样简单，现在看来真的是大错特错，CSS其实是很神奇的。捂脸ing～
CSS3在布局方面做了非常大的改进，使得我们对块级元素的布局排列变得十分灵活，适应性非常强，其强大的伸缩性，在响应式开中可以发挥极大的作用。
文本溢出截断省略是比较常见的业务场景，主要分为单行文本溢出截断省略与多行文本溢出截断省略，单行的截断方案比较简单，多行截断相对比较复杂。
至于怎么更换链接，请看：https://music.163.com/#/outchain/0/5388442370/
在构建 React 应用程序时，总会有一些情况，您不希望重新渲染组件，除非某些 prop 或值发生了更改，或者达到了某些条件；这称为条件渲染。
3.项目结构 开始编码前，我们先了解下项目的结构。 3.1.目录结构 3.2.调用关系 我们最主要理清index.html、main.js、App.vue之间的关系： 理一下： index.html：
vue的介绍 vue官网说：Vue.js（读音 /vjuː/，类似于 view） 是一套构建用户界面的渐进式框架。与其他重量级框架不同的是，Vue 采用自底向上增量开发的设计。 vue的优点 1.易用 已经会了 HTML、CSS、JavaScript？即刻阅读指南开始构建应用！ 2.灵活 不断繁荣的生态系统，可以在一个库和一套完整框架之间自如伸缩。 3.高效 20kB min+gzip 运行大小 超快虚拟 DOM 最省心的优化 虚拟的DOM的核心思想是：对复杂的文档D
项目基础配置使用 vue-cli2 生成 自适应方案核心： 阿里可伸缩布局方案 lib-flexible px转rem：px2rem，它有webpack的loader px2rem
CSS3 新增了弹性盒子模型（Flexible Box 或 FlexBox），是一种新的用于在 HTML 页面实现布局的方式。使得当 HTML 页面适应不同尺寸的屏幕和不同的设备时，元素是可预测地运行。
加载时直接播放音频的方式：new Audio("BY2.mp3").play();
最近在学习Serverless架构相关的知识，学习过程中发现一个有趣的现象：无论是教程示例，还是场景实例，Serverless架构中鲜有出现数据库的身影。各类文章所介绍的Serverless架构应用场景中，也几乎都是无需数据库的业务场景。在一些教程文章中，对于一些需要进行数据存储的场景，通常的做法是将数据存储在 JSON 文件中，然后上传到对象存储服务中，在搜索相关资料的过程中甚至还发现了SQLite+对象存储这种很硬核的数据存储方式，这些方法显然只能应对简单的数据存储。那么数据库作为互联网时代的基石，从单体架构到微服务架构，其都扮演着举足轻重的角色，为何偏偏在Serverless架构中存在感这么低呢？
困境 在响应式布局中，我们应该小心对待iframe元素，iframe元素的width和height属性设置了其宽度和高度，但是当包含块的宽度或高度小于iframe的宽度或高度时，会
angular 09 年 年份较早 一开始是拒绝 react 13年 用户体验好，一些大公司使用 直接拉到一堆粉丝 vue 14年， 用户体验好 （数据属性非常非常多 上线的时候就会卡顿，react就不会） 尤雨溪（中国人）
最近做了两个关于h5页面对接公众号的项目，不得不提打开微信浏览器内置地图导航的功能确实有点恶心。下次想起来了的话，进行总结分享一下如何处理。在vue移动端h5页面当中，其中适配是经常会遇到的问题，这块主要有死个方法可以适用。
在大多数 React 应用程序中，应用程序需要来自 API 或服务器的数据才能正常运行。也会将数据从应用程序提交到服务器以接收某种响应。有几种方法可以将此数据发送/获取到 API 或服务器，可以使用内置的 API 或外部 npm 包来实现。
如果template中定义了内容，那么优先加载template，如果没有定义内容加载el的模板
我们在上面《页面分类》的项目中，对 tap 事件的处理使用的是 touch 事件处理的，因为如果使用 click 事件的话，总会有延时。
本文为翻译文章，原文链接： https://medium.com/@9haroon_dev/introducing-atomic-design-in-vue-js-a9e873637a3e
概述 Node.js是什么 Node 是一个服务器端 JavaScript 解释器，用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用事件驱动， 非阻塞I/O 模型而得以轻量和高效，非常适合在分布式设备上运行数据密集型的实时应用。 Node.js 是一个可以让 JavaScript 运行在浏览器之外的平台。它实现了诸如文件系统、模块、包、操作系统 API、网络通信等 Core JavaScript 没有或者不完善的功能。历史上将 JavaScript移植到浏览器外的计划不止一个，但Nod
概述 Node.js是什么 Node 是一个服务器端 JavaScript 解释器，用于方便地搭建响应速度快、易于扩展的网络应用。Node.js 使用事件驱动， 非阻塞I/O 模型而得以轻量和高效，非常适合在分布式设备上运行数据密集型的实时应用。 Node.js 是一个可以让 JavaScript 运行在浏览器之外的平台。它实现了诸如文件系统、模块、包、操作系统 API、网络通信等 Core JavaScript 没有或者不完善的功能。历史上将 JavaScript移植到浏览器外的计划不止一个，但Node.
页面模板 <!DOCTYPE html> 2 <html> 3 <head> 4 <meta charset="UTF-8"> 5 <meta http-equiv="X-UA-Compatible" content="IE=edge"> 6 <meta name="description" content="本网站的目的是....." /> 7 <meta name="keywords" content="作品集,素材库"
在我们的日常开发工作中，文本溢出截断省略是很常见的一种需考虑的业务场景细节。看上去 “稀松平常” ，但在实现上却有不同的区分，是单行截断还是多行截断？多行的截断判断是基于行数还是基于高度？这些问题之下，都有哪些实现方案？他们之间的差异性和场景适应性又是如何？凡事就怕较真，较真必有成长。本文试图通过编码实践，给出一些答案。
SSR（Server-Side Rendering，服务器端渲染）是指将 React、Vue、Angular 等客户端渲染的应用在服务器端执行一次，然后将渲染结果返回给浏览器进行展示的过程。相对于客户端渲染（CSR，Client-Side Rendering），SSR 可以提高页面的首屏加载速度和搜索引擎优化（SEO），因为它可以在服务器端直接生成 HTML，并将静态资源（如 CSS、JavaScript 等）和页面数据一起返回给客户端，从而减少客户端的渲染工作量。
MDL的布局/Layout组件用来作为整个页面其他元素的容器，可以自动适应不同的浏览器、 屏幕尺寸和设备。
我们在之前的文章中已经掌握了CSS的大部分内容，但仍有一些内容我们没有涉略，这篇文章就是为了补充前面没有涉及的内容，为我们的知识做出补充并且介绍一些布局技巧
Flex伸缩布局决定性的特性是让伸缩项目可伸缩，也就是让伸缩项目的宽度或高度自动填充剩余的空间。这可以以flex属性完成。一个伸缩容器会等比地按照各伸缩项目的 扩展比率 分配剩余空间，也会按照 收缩比率 缩小各项目以避免溢出。
布局的传统解决方案，基于盒状模型，依赖 display属性 + position属性 + float属性。它对于那些特殊布局非常不方便，比如，垂直居中 就不容易实现。
伸缩容器是display的计算值为flex或inline-flex的元素，其流内孩子就是伸缩项（flex item）
<component> 是vue官方提供的标签，通过更改 is 指向的子组件名来动态切换组件。
SVG动画由SVG元素内部的元素属性控制，一般通过一下几个元素控制： - 用于控制动画延时 - 对属性的连续改变进行控制 - 颜色变化，但用就能控制 - 控制如缩放、旋转等几何变化 - 控制SVG内元素的移动路径
使用一个Vue实例作为中央事件总线。 Vue内部有一个事件机制，可以参考源码。 $on方法用来监听一个事件 $emit用来触发一个事件。
我们在开发前端页面的时候，如果每一个按钮、样式、处理浏览器兼容性的代码都要自己从零开始去写，那就太浪费时间了。所以我们需要一个框架，帮我们实现一个页面的基础部分和解决一些繁琐的细节，只要在它的基础上进行个性化定制就可以了。
二、flex-direction 该属性通过定义flex容器的主轴方向来决定felx子项在flex容器中的位置
流动布局有3种布局模型，分别是流动布局（常规默认时）、定位布局（relative）以及浮动布局，其中所述的流动布局、定位布局已在第一点讲解，接下来咱们查看浮动布局。
2020年，是个不平凡的一年，因为疫情的蔓延打乱了我的全盘计划。但在工作中，完成了目标项目、攻克了技术难关、学习了新的技术，也感谢平台！
在日常开发展示页面，如果一段文本的数量过长，受制于元素宽度的因素，有可能不能完全显示，为了提高用户的使用体验，这个时候就需要我们把溢出的文本显示成省略号。
引入魔改样式的方法很简单，自建一个css文件，然后引入即可。 以butterfly主题为例。可以在[Blogroot]\themes\butterfly\source\css\目录下新建custom.css文件，然后在[Blogroot]\_config.butterfly.yml的inject配置项中引入自定义样式文件。
前几天改主题，把我原来的区分大小屏功能给弄没了，今天找了一天才给找回来，赶紧抄笔记下来。
上一篇我做了一个在线白板！给大家介绍了一下矩形的绘制、选中、拖动、旋转、伸缩，以及放大缩小、网格模式、导出图片等功能，本文继续为各位介绍一下箭头的绘制、自由书写、文字的绘制，以及如何按比例缩放文字图片等这些需要固定长宽比例的图形、如何缩放自由书写折线这些由多个点构成的元素。
flex的一些属性 CSS3中引入了另一种框--flexbox，flexbox有一些block和inline不同的性质，比如： 自适应子元素（flex item，又称伸缩项目）的宽度 伸缩项目的float，clear，vertical-align属性失效 不能继承flex框，但可以依次设置 可以修改flex流的方向以及布置规则 现在就大体讲述下这个具体属性的表示含义。 设置flexbox的兼容性 将一个容器设置为flexbox（又称伸缩容器）很简单，但是却存在一些兼容性的问题，比如
看似十分简单的标题截断效果，但是竟然没有一个统一 CSS 属性实现标准，需要用到一些奇淫妙计来实现，一般来说，在做这样文字截断效果时我们更多是希望：
领取专属 10元无门槛券
手把手带您无忧上云
云服务器
ICP备案
对象存储
即时通信 IM
实时音视频
