自定义博客皮肤VIP专享

*博客头图:

格式为PNG、JPG,宽度*高度大于1920*100像素,不超过2MB,主视觉建议放在右侧,请参照线上博客头图

请上传大于1920*100像素的图片!

博客底图:

图片格式为PNG、JPG,不超过1MB,可上下左右平铺至整个背景

栏目图:

图片格式为PNG、JPG,图片宽度*高度为300*38像素,不超过0.5MB

主标题颜色:

RGB颜色,例如:#AFAFAF

Hover:

RGB颜色,例如:#AFAFAF

副标题颜色:

RGB颜色,例如:#AFAFAF

自定义博客皮肤

-+
  • 博客(7)
  • 收藏
  • 关注

原创 React项目打包部署注意点 + 宝塔面板几步部署项目

1.react项目打包1.1 终端运行打包命令在编辑器的终端运行vue项目打包命令yarn build打包成功如下:这时我们可以看到项目目录多出来一个build文件夹,记住它,后面部署就靠它了。1.2 修改配置在package.json里面添加一行:"homepage": "."如果不加上这个的话之后打包的时候,打开index.html会报错,示例如下:2.宝塔面板部署项目2.1 部署要求有一台云服务器(笔者这里用的是腾讯云)服务器安装宝塔面板 安装教程2.2 在

2021-08-11 21:29:34 3684 5

原创 vue项目打包部署注意点 + 宝塔面板几步部署项目

1.vue项目打包1.1 终端运行打包命令在编辑器的终端运行vue项目打包命令yarn run build打包成功如下:这时我们可以看到项目目录多出来一个dist文件夹,记住它,后面部署就靠它了。1.2 修改配置就我个人部署经历(宝塔面板快速部署)来说,这个配置是一定要修改的,如果不修改配置,直接将build后的dist包部署,运行后页面是空白的。修改配置要分两个处理方式(vue-cli2和vue-cli3),这里只说 vue-cli3,至于vue-cli2 可在最后的参考博文里找到配置

2021-08-11 21:25:32 7733 5

原创 CSS中伪类与伪元素的概念、区别及常见用法

1. CSS 选择器想要了解伪类与伪元素,我们不得不提到 CSS 选择器,CSS 选择器是元素和其他部分组合起来,告诉浏览器哪个 HTML 元素应当是被选为应用规则中的 CSS 属性值的方式选择器的种类有:类型、类和ID选择器标签属性选择器运算符伪类与伪元素2. 伪类与伪元素2.1 什么是伪类?什么是伪元素?伪类:伪类是选择器的一种,它用于选择处于 特定状态 的元素,比如当它们是这一类型的第一个元素时,或者是当鼠标指针悬浮在元素上面的时候。它们表现得会像是你向你的文档的某个部分应用了一

2021-08-11 21:19:55 684

原创 关于一些CSS中改变元素位置的属性的百分比参考对象的总结

1.写在前面在写页面CSS过程中不可避免的需要写到一些改变元素位置的属性,例如改变元素外边距、内边距,改变定位元素的偏移等,当这些元素属性设置为一个绝对的数值时,你当然知道它会移动一个绝对的数值的位置;然而当其设置为百分比值时,你是否会思考:这个百分比值是相对于其包含块的大小还是相对于元素自身的大小呢?本文就一些常用改变元素位置的属性的百分比参考对象给出总结。2.参考对象2.1 定位属性toprightbottomlefttop、left、right、bottom是定位元素属性,非定位

2021-08-09 23:55:31 318

原创 Grid 网格布局入门与总结

写在前面grid布局笔者学习时主要参考阮一峰老师的grid讲解,这里给出参考链接可做补充学习,CSS Grid 网格布局教程。以下则为笔者个人对grid网格布局要点的提炼和个人学习总结,仅供参考。理论知识1.概述网格布局(Grid)是最强大的 CSS 布局方案。Flex 布局是轴线布局,只能指定"项目"针对轴线的位置,可以看作是一维布局。Grid 布局则是将容器划分成"行"和"列",产生单元格,然后指定"项目所在"的单元格,可以看作是二维布局。Grid 布局远比 Flex 布局强大。2.基本概

2021-08-09 23:54:23 282

原创 flex布局个人学习总结及入门案例

写在前面flex布局笔者学习时主要参考阮一峰老师的flex讲解,这里给出参考链接可做补充学习,Flex布局教程:语法篇、 Flex布局教程:实例篇。下面则为笔者个人学习总结和一个入门案例。理论知识采用 Flex 布局的元素,称为 Flex 容器(flex container),简称"容器"。它的所有子元素自动成为容器成员,称为 Flex 项目(flex item),简称"项目"。容器默认存在两根轴:水平的主轴(main axis)和垂直的交叉轴(cross axis)。主轴的开始位置(与边框的交

2021-08-09 23:50:05 265

原创 一眼便知CSS水平、垂直布局

写在前面以下代码均通过博主测试验证,是没有问题的,只需要根据不同的情况灵活引用不同的代码即可。以下给出的代码全都是CSS代码,需要放在CSS选择器里面。水平居中1.普通的文本,写在父元素的选择器上 text-align: center;2.行内元素,如span、strong等,写在父元素的选择器上 text-align: center;3.行内块级元素,写在父元素的选择器上 text-align: center;4.行内替换元素,如img等,写在父元素的选择器上 text-

2021-08-09 23:43:48 72

空空如也

空空如也

TA创建的收藏夹 TA关注的收藏夹

TA关注的人

提示
确定要删除当前文章?
取消 删除