鱼与前端🐟

前言本文介绍了落地页的内容，设计风格以及落地页对用户的吸引作用。 何为LandingPagelandingpage是一种网页设计风格制作的网页，中文名是落地页，像下面这几种它们都有非常鲜明的特点，就是非常集中式的引导用户进入某个选项。相比起传统的网页，落地页不需要用户去探索页面的各种内容，而是专于某种目的，比如推销产品，展现简历内容等。 LandingPage的制作其实landingpage的制作并不太需要很好的前端能力，甚至现在很多开发网页都可以使用框架生成或者软件生成，这样有助于设计者更专注于界面的设计而非功能的使用，并且因为落地页基本不需要后台的功能，所以落地页基本是静态的网站，也就加快了网页的访问速度，减少用户的等待时间，进一步留住用户提高访问量。另外，正常的网页中目标导向太多，导致用户不知道应该点哪个以进行下一步的选择，这样不仅会导致使用者的流失，也会导致设计者投资的广告费用白白浪费，所以一个正确的landingpage应该具有以下几点要求 精美的设计 收集信息的表格 详细的产品或服务描述 以往客户评价 关于实际制作landing page 需要使用到wordpress ...

前言本文主要用于记录前端面试常考题 前端基础HTTP/HTML/浏览器说一下http和https基本概念区别https的工作原理https协议的优缺点http 超文本传输协议 是互联网上应用最广泛的一种网络协议，是一个客户端和服务器端请求和应答的标准（tcp），用于从www服务器传输超文本到本地浏览器的传输协议，它可以使浏览器更加高效，使网络传输减少https 是以安全为目标的http通道，简单讲是http的安全版，即http下加入ssl层，https的安全基础是ssl，因此加密的详细内容就需要sslhttps协议的主要作用是：建立一个信息安全通道，来确保数组的传输，确保网站的真实性https协议需要ca证书 费用比较高http的信息是明文传输，https是经过ssl协议加密传输的端口不同 一般来讲http是80端口 https是443端口客户使用https url访问服务器，则要求web服务器建立ssl连接web服务器收到客户端的请求后，将网站的证书（里面包含公钥）返回or传输给客户端客户端和web服务器端开始协商ssl链接的安全等级客户端浏览器通过双方协商一致的安全等级，建立会话 ...

本文主要用于记录Vue2.0的组件化编程功能和vux管理数据，参考视频【尚硅谷Vue2.0+Vue3.0全套教程丨vuejs从入门到精通】 主要介绍效果展示实现应用中局部功能代码和资源的集合代码复用组件可以产生嵌套 模块与组件 模块化与组件化模块组件模块化组件化 向外提供特定功能的js程序 一般就是一个js文件 为什么 ？ 因为js文件很多很复杂 作用 复用js 简化js的编写 提高js运行效率 用来实现局部（特定）功能效果的代码集合（html/css/js/image…） 为什么？ 一个界面的功能很复杂 作用 复用编码 简化项目编码 提高运行效率 当应用中的js都已模块化来编写 那这个应用就是一个模块化应用当应用中的功能都是以多组件的形式来编写 那么这个应用就是一个组件化应用 非单文件组件主要介绍基本语法经典案例vue提供非单文件组件的形式 使得一个文件包含有n个组件来编写为什么组件中要使用data:{return{xxx}}?123456789101112131415<script> // const data = { // x:1, ...

前言本文主要介绍如何给自己的替身匹配相应的面板 效果展示 配置参数鉴于在线版网址已经挂掉的情况下，建议使用离线版本，本质也是个echarts图表 在线版地址:点击离线版地址:点击之后右键另存为html使用方法： 选择右边输入数值之后生成数据 之后右击图片另存为，注意是替身面板，不是整个图片 下载以下任意图片 用ps工具覆盖刚刚的面板数值上去 下面介绍的是来自于b站up主木南工坊的pr替身教学 可以直接参考原视频的地址

前言本文用自建的jojo信封替换原akilar博客的蓝色信封，原帖地址:akilar的信封留言板 效果展示 配置参数 在[Blogroot]运行指令1npm install hexo-butterfly-envelope --save 在站点配置文件或者主题配置文件添加配置项（对，两者任一均可。但不要都写）12345678910111213141516# envelope_comment# see https://akilar.top/posts/58900a8/envelope_comment: enable: true #开关 cover: https://ae01.alicdn.com/kf/U5bb04af32be544c4b41206d9a42fcacfd.jpg #信笺封面图 message: #信笺内容，支持多行 - 有什么想问的？ - 有什么想说的？ - 有什么想吐槽的？ - 哪怕是有什么想吃的，都可以告诉我哦~ bottom: 自动书记人偶竭诚为您服务！ #信笺结束语，只能单行 height: #调整信笺划出高度，默认1050px ...

前言初次尝试使用Typora编写上传博客的时候，发现图片居然都加载不出来，原因是使用软件截屏的时候直接cv到了文章内容里面，地址还是本地的地址，以下提供了两种方案对图片进行在线化处理。 自2021年12月开始jsdeliver不提供中国内部的加速服务，可以自行斟酌换cdn加速，笔者学校网络暂时没有影响。 PicGo图床本地插件 安装PicGO图床 打开github 右上角选择你的仓库 新建一个仓库 仓库名称为picgo 公开该仓库 回到右上角settings 选择Developer settings 选择Personal acess tokens 并创建新的token之后复制下来(只有一次) 回到PicGo 在图床设置里选择github图床 设为默认图床后确定提供一下cdn加速的地址，cv即可: https://cdn.jsdelivr.net/gh/ 安装插件1npm install hexo-asset-image --save 在_config.yml配置文件中，修改为post_asset_folder: true， 然后新建一篇文章1hexo new post ces ...

前言采用wowjs对主页进行动画效果处理，使得页面加载更加平滑流畅 预览效果 主要配置 引入wow.min.js 和 animated.min.css123456inject: head: - <link rel="stylesheet" href="https://cdnjs.cloudflare.com/ajax/libs/animate.css/4.1.1/animate.min.css" media="defer" onload="this.media='all'"> bottom: - <script defer src="https://cdn.jsdelivr.net/gh/graingert/wow@1.3.0/dist/wow.min.js"></script&g ...

前言本教程为rgb头像魔改，替换原先的头像，可以自定义颜色。 预览效果 主要配置 引入rgbHead.css1234567891011121314151617181920212223242526272829303132333435363738394041424344454647484950515253545556575859606162636465666768697071727374757677/* rgb头像魔改 */.avatar-img { display: flex; justify-content: center; align-items: center; overflow: visible; border-radius: 55px; box-shadow: 0 0 10px black; background: linear-gradient(135deg, rgb(1, 255, 234), rgb( ...

前言本教程分为两个版本，一个是插件版本，一个是修改源代码的版本。两个版本选择一个即可。 预览效果 源代码版(个人使用)插件版 引入aplayer.pug打开themes\hexo-theme-butterfly\layout\includes\head.pug里面添加1include ./third-party/aplayer.pug 创建aplayer.pug在themes\hexo-theme-butterfly\layout\includes\third-party下创建aplayer.pug 内容如下123456if theme.aplayer && theme.aplayer.enable .aplayer(data-id=theme.aplayer.id data-server=theme.aplayer.server data-type=theme.aplayer.type data-fixed=theme.aplayer.fixed ...

Hexo搭建本博客使用Hexo框架搭建，Hexo是一款轻量级，高效的博客框架，可以使用markdown对文章进行编写，可以实现无后端评论系统，站内搜索等，以及支持一键部署到github或gitee等主流代码平台，让使用者更加专注于博客内容的更新，以下是hexo的官网，内有使用文档以及其他教程，本篇视频资源参考自【2021最新版】保姆级Hexo+github搭建个人博客 基础工具git+nodejs git是一款强大的项目管理工具，可以用于自定义项目的管理，实现进度的上传以及拉去，安装git随后自行选择32位或者64位安装 之后一路next，安装之后使用git -v验证是否安装成功 nodejs，一款前端程序员必备的服务端语言，安装地址nodejs，也是一路next安装，随后打开cmd输入node -v和npm -v验证是否安装成功 安装Hexo 新建一个项目文件夹，命名随意，用来放自己的博客内容，我的是blog 进入该文件夹，右键git bash输入以下指令安装hexo（注意git的命令窗口不是使用ctrl v进行粘贴，建议右键paste） 1npm install -g ...