<?xml version="1.0" encoding="utf-8" ?><rss version="2.0"><channel><title><![CDATA[A mei不会敲代码的博客]]></title><description><![CDATA[这是我的笔记]]></description><link>https://blog.youkuaiyun.com/HW7_Messi</link><language>zh-cn</language><generator>https://blog.youkuaiyun.com/</generator><copyright><![CDATA[Copyright &copy; HW7_Messi]]></copyright><item><title><![CDATA[腾讯云/宝塔，docker安装RabbitMQ，内网可以打开，外网打不开管理面板]]></title><link>https://blog.youkuaiyun.com/HW7_Messi/article/details/128277497</link><guid>https://blog.youkuaiyun.com/HW7_Messi/article/details/128277497</guid><author>HW7_Messi</author><pubDate>Sun, 11 Dec 2022 19:08:08 +0800</pubDate><description><![CDATA[linuxdocker配置rabbitmq]]></description><category></category></item><item><title><![CDATA[Docker启动MySql时Exited (1) 8 seconds ago或者Error response from daemon: Container xx is not running的解决方法]]></title><link>https://blog.youkuaiyun.com/HW7_Messi/article/details/128268395</link><guid>https://blog.youkuaiyun.com/HW7_Messi/article/details/128268395</guid><author>HW7_Messi</author><pubDate>Sat, 10 Dec 2022 19:59:45 +0800</pubDate><description><![CDATA[Docker启动MySql时Exited (1) 8 seconds ago或者Error response from daemon: Container xx is not running的解决方法]]></description><category></category></item><item><title><![CDATA[14 过渡（transition）]]></title><link>https://blog.youkuaiyun.com/HW7_Messi/article/details/121325553</link><guid>https://blog.youkuaiyun.com/HW7_Messi/article/details/121325553</guid><author>HW7_Messi</author><pubDate>Tue, 07 Dec 2021 12:33:57 +0800</pubDate><description><![CDATA[这里写目录过渡（transition）动画实战例子1. 米兔2.奔跑的少年3.弹力球4. 酷炫球
过渡（transition）
过渡指定一个属性发生变化时的一个切换方式
过渡可以有一些非常好的体验，提升用户体验
属性

transition-property指定执行过渡的属性
transition-duration 过渡时间
tansition-delay过渡效果的延迟（等待一段时间在进行过渡）
transition-timing-function过渡的时序函数
- linear匀速运动
- ease 默认]]></description><category></category></item><item><title><![CDATA[15 变形`transform`：平移、旋转、缩放]]></title><link>https://blog.youkuaiyun.com/HW7_Messi/article/details/121327984</link><guid>https://blog.youkuaiyun.com/HW7_Messi/article/details/121327984</guid><author>HW7_Messi</author><pubDate>Tue, 07 Dec 2021 12:33:31 +0800</pubDate><description><![CDATA[目录变形`transform`：平移、旋转、缩放1. 平移示例:浮出效果z轴平移2. 旋转3. 缩放
变形transform：平移、旋转、缩放
变形通过css改变元素的形状或者位置
但不该页面布局
1. 平移
属性

translateX()沿着x轴方向平移
translateY() 沿着y轴方向平移
translateZ() 沿着z轴方向平移元素


z轴就是人眼与屏幕的方向

如果用百分比去平移，那百分比是相对于自身计算的
垂直水平居中的方式举例

使用绝对定位/* 这种居中方式，只适用于元素的大小确定]]></description><category></category></item><item><title><![CDATA[16 less]]></title><link>https://blog.youkuaiyun.com/HW7_Messi/article/details/121331508</link><guid>https://blog.youkuaiyun.com/HW7_Messi/article/details/121331508</guid><author>HW7_Messi</author><pubDate>Tue, 07 Dec 2021 12:33:18 +0800</pubDate><description><![CDATA[目录lessless语法1. 注释2. 父子关系嵌套3. 变量三级目录
less
less 是一门css的预处理语言

less 是css的增强版，可以编写很少的代码实现更强大的样式
less里面有很多新的特性，如：变量，函数
less的语法跟css一致，但是less有很多新的扩展，less文件不能直接被执行，要先转换为css文件进行引用


less 编写的更加方便，less就像一种辅助语法，使用的时候直接转换成css文件引用即可

在vscode中有一个less插件，编写完，插件会自动转换成css文件
]]></description><category></category></item><item><title><![CDATA[06-盒子模型]]></title><link>https://blog.youkuaiyun.com/HW7_Messi/article/details/120799993</link><guid>https://blog.youkuaiyun.com/HW7_Messi/article/details/120799993</guid><author>HW7_Messi</author><pubDate>Sat, 30 Oct 2021 14:53:16 +0800</pubDate><description><![CDATA[文章目录盒子模型1. 文档流（normalflow）2. 块元素3. 行内元素4. 盒子模型盒模型、盒子模型、框模型（box model）内容区边框（border）内边距外边距5. 水平方向布局元素溢出边距折叠兄弟元素父子元素6. 垂直方向布局7. 行内元素的盒模型8. 浏览器的默认样式
盒子模型
1. 文档流（normalflow）
网页就是一个多层的结构，一层摁着一层
通过CSS可以分别为每一层来设置样式，作为用户来讲只能看到最顶上一层
这些层中，最底下的一层称为文档流
文档流是网页的基础我们所创建的元]]></description><category></category></item><item><title><![CDATA[07-浮动]]></title><link>https://blog.youkuaiyun.com/HW7_Messi/article/details/120833964</link><guid>https://blog.youkuaiyun.com/HW7_Messi/article/details/120833964</guid><author>HW7_Messi</author><pubDate>Sat, 30 Oct 2021 14:53:07 +0800</pubDate><description><![CDATA[这里写自定义目录标题浮动1. 浮动简介2. 浮动特点3. 脱离文档流的特点
浮动
1. 浮动简介
浮动，可以使用一个元素向其父元素的左侧或者右侧移动
使用float 属性上设置元素的浮动
float可选值:

none 默认值，元素不浮动
left 元素向左浮动
right 元素向右浮动

注意：

元素浮动之后，水平布局不需要满足强制公式
浮动之后，脱离文档流，像一个气球一样浮在上面，不会占用文档流的位置，所以其他元素可以占用浮动之前的位置

2. 浮动特点

脱离文档流，不占据文档流的布局位置（气球）
]]></description><category></category></item><item><title><![CDATA[08-高度塌陷与BFC]]></title><link>https://blog.youkuaiyun.com/HW7_Messi/article/details/120837217</link><guid>https://blog.youkuaiyun.com/HW7_Messi/article/details/120837217</guid><author>HW7_Messi</author><pubDate>Sat, 30 Oct 2021 14:52:57 +0800</pubDate><description><![CDATA[目录高度塌陷与BFC1.高度塌陷2.BFC1.高度塌陷1.高度塌陷1.高度塌陷
高度塌陷与BFC
1.高度塌陷
在浮动布局中，父元素的高度默认是被子元素撑开的
当子元素浮动后，其会完全脱离文档流，子元素从文档流中脱离将会无法撑起父元素的高度，导致父元素的高度丢失
父元素高度丢失以后，其下的元素会自动上移，导致页面的布局混乱
注意：所以高度塌陷是浮动布局中比较常见的一个问题，这个问题我们必须要进行处理！

2.BFC
BFC（Block Formatting Context）块级格式化环境

BFC是一个CS]]></description><category></category></item><item><title><![CDATA[09-定位]]></title><link>https://blog.youkuaiyun.com/HW7_Messi/article/details/120848894</link><guid>https://blog.youkuaiyun.com/HW7_Messi/article/details/120848894</guid><author>HW7_Messi</author><pubDate>Sat, 30 Oct 2021 14:52:42 +0800</pubDate><description><![CDATA[目录定位1 相对定位`relative`偏移量2 绝对定位如何定位，以什么来定位？3. 固定定位4. 粘滞定位
定位
我们实际开发中，页面上的元素可能很多，这样改必然是 牵一发而动全身
那么仅仅靠我们之前学习的布局知识，不足以轻松应对这种场景
那么就势必需要一个方便我们处理这种场景的办法，它就是定位
定位（position）
定位是一种更加高级的布局手段
通过定位可以将元素摆放到页面的任意位置
使用position属性来设置定位




可选值
含义




static
不开启定位，元素是静止的，默认值
]]></description><category></category></item><item><title><![CDATA[10-字体]]></title><link>https://blog.youkuaiyun.com/HW7_Messi/article/details/120866536</link><guid>https://blog.youkuaiyun.com/HW7_Messi/article/details/120866536</guid><author>HW7_Messi</author><pubDate>Sat, 30 Oct 2021 14:52:22 +0800</pubDate><description><![CDATA[目录字体1. 字体样式2. font-family 字体族（字体格式）3. @font-face （自定义字体）
字体
1. 字体样式

color 字体颜色
font-size 字体大小
font-style斜体
font-weight字体的粗细

2. font-family 字体族（字体格式）
可选值（字体的分类）

下述字体均不表示具体的某种字体，而是字体的分类，我们经常使用的一些字体，如微软雅黑、黑体、楷体、宋体、Consolas等，才是具体的某种字体


serif 衬线字体
在每个字母的边缘都]]></description><category></category></item><item><title><![CDATA[11-背景]]></title><link>https://blog.youkuaiyun.com/HW7_Messi/article/details/120906575</link><guid>https://blog.youkuaiyun.com/HW7_Messi/article/details/120906575</guid><author>HW7_Messi</author><pubDate>Sat, 30 Oct 2021 14:52:09 +0800</pubDate><description><![CDATA[目录背景1. background-image 设置背景图片2. background-repeat  设置背景的重复方式3. background-position 用来设置背景图片的位置4. background-clip 设置背景的范围5. background-origin 背景图片的偏移量计算的原点6.background-size 设置背景图片的大小7. background-attachment 背景图片是否跟随元素移动
背景

background-color 背景颜色
background]]></description><category></category></item><item><title><![CDATA[12-雪碧图与渐变]]></title><link>https://blog.youkuaiyun.com/HW7_Messi/article/details/121047312</link><guid>https://blog.youkuaiyun.com/HW7_Messi/article/details/121047312</guid><author>HW7_Messi</author><pubDate>Sat, 30 Oct 2021 14:51:58 +0800</pubDate><description><![CDATA[目录雪碧图与渐变1.雪碧图2 . 线性渐变 `linear-gradient`3.径向渐变`radial-gradient() `
雪碧图与渐变
1.雪碧图
解决图片闪烁问题
就是把多个图片放在一个图片里面，然后通过调整background-position来显示对应的图片，这种图片就叫雪碧图
这样的好处

解决闪烁问题
文件小，加载速度快，访问快，提升用户体验

使用方法：

先确定使用图中的哪个图标
测量图标大小
根据图标大小创建一个元素
将雪碧图设置为元素的背景
设置一个偏移量以显示正确的图片

示例]]></description><category></category></item><item><title><![CDATA[13-表格和表单]]></title><link>https://blog.youkuaiyun.com/HW7_Messi/article/details/121047958</link><guid>https://blog.youkuaiyun.com/HW7_Messi/article/details/121047958</guid><author>HW7_Messi</author><pubDate>Sat, 30 Oct 2021 14:51:03 +0800</pubDate><description><![CDATA[目录表格和表单表格1. 基础知识2. 长表格3.表格css样式表单1 . 表单属性2. 表单元素
表格和表单
表格
1. 基础知识
tr 表示行
td 表示列
rowspan 纵向的合并单元格
colspan 横向的合并单元格
&lt;table border="1" width="50%" align=" center"&gt;
    &lt;!--在table中使用tr表示表格中的一行，有几个tr就有几行--&gt;
    &lt;tr&gt;
        &lt;!--在tr中使用td表示一个]]></description><category></category></item></channel></rss>