Vercel 托管博客
背景本站已托管至 Vercel，但作为一名前端小白，昨天帮朋友托管博客到 Vercel 的过程中到处碰壁，就想写一篇博客记录一下。 注册登录点击 Vercel 官网 Vercel, 并使用 GitHub 登录。 注意 GitHub 账户绑定的主邮箱📪，实测 QQ 邮箱会出现无法使用 GitHub 登陆 Vercel 的情况 导入仓库 FRAMEWORK PRESET 选择 Other Import Git Repository Enter the URL of a Git repository to deploy it，复制自己的 GitHub Pages 地址链接 等待导入成功 绑定并解析域名点击 Settings👉Domains👉输入自己的域名，并在域名购买方控制台进行域名解析（CNAME），值为 Vercel 提供的任一域名。解析完成后即可通过自己的域名访问博客。
Butterfly 魔改 (涉及修改源码)
此教程涉及修改源码 Butterfly 侧边栏引入一言背景在修改每页显示 7 篇文章后，出现了这种情况。这是完美主义（强迫症）的我所不能忍受的，有什么可以占据这里的呢？一言 开搞创建 card_hitokoto在主题配置文件 Butterfly/_config.yml 中的侧边栏设置中添加 card_hitokoto: enable: true 1234567891011121314151617181920212223242526272829303132333435aside: enable: true mobile: true # display on mobile position: right # left or right card_author: enable: true description: button: icon: fab fa-github text: Follow Me link: https://github.com/flipped-1121 card_announcement: enable ...
前端学习（六）
记录前端学习 学习之路・CSS-01好久不见本着 “博客想写就写” 的原则（其实就是懒），终于点开了_posts 文件夹。 因本人习惯，笔记在 WebStorm 上呈现 1234567891011121314151617181920212223<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8"> <title>CSS</title> <style> p2 { color: cadetblue; } p3 { font-size: 26px; } </style></head><body><p1>CSS</p1><br><p2>CSS改变字体颜色</p2><br><p3>CSS改变字体大小 ...
前端学习（五）
记录前端学习 学习之路・HTML-05因本人习惯，笔记在 WebStorm 上呈现 Form1.htmlForm2.html123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8"> <title>表单</title>& ...
前端学习（四）
记录前端学习 学习之路・HTML-04因本人习惯，笔记在 WebStorm 上呈现 12345678910111213141516171819202122232425262728293031323334353637383940414243444546474849505152<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8"> <title>列表</title></head><body><!--无序列表--><!--无序列表是一个项目的列表，此列项目使用粗体圆点（典型的小黑圆圈）进行标记。无序列表始于<ul>标签。每个列表项始于<li>--><h2>学习</h2><ul> <li>准备阶段</li> <li>理论学习</li> <li>实际操作& ...
前端学习（三）
记录前端学习 学习之路・HTML-03因本人习惯，笔记在 WebStorm 上呈现 Table1.htmlTable2.html123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8"> <title>表格</title>&l ...
前端学习（二）
记录前端学习 学习之路・HTML-02因本人习惯，笔记在 WebStorm 上呈现 Img.htmlHref.htmlDemo.html1234567891011121314151617181920212223242526272829303132333435<!DOCTYPE html><html lang="zh-CN"><head> <meta charset="UTF-8"> <title>图像标签</title></head><body><!--键值对形式--><!--当图片无法显示时，显示"alt"的值--><!--alt 属性是一个必需的属性，它规定在图像无法显示时的替代文本。假设由于下列原因用户无法查看图像，alt 属性可以为图像提供替代的信息： 1.网速太慢 2.src 属性中的错误 3.浏览器禁用图像 4.用户使用的是屏幕阅读器--><img src="0ff466031165937ed27 ...
