闲来无事寻思自己有一台vps和一个域名，索性尝试学习一些前端知识搭建一个blog网站， 昨天花时间想认真学一学HTML跟CSS，这篇blog就来记录下学习过程......
1. 有关HTML的部分
HTML感觉不算困难，有h1到h6一共6个标题标签，p一个段落标签，通过<p>和</p>来说明要展示的标签的文本; 还有div标签来装载其他标签，div和h1-h6,以及p标签默认都是block类型，block类型独占父容器给的最大宽度， 尽管可以通过width来设置盒子宽度，后面的盒子也不会挤在前一个block盒子的右边。 还有默认为inline类型的a标签，sanp标签，以及strong标签，由于是行内元素，所以允许与其他元素并排，inline盒子的宽度和高度都不能手动调节 而img标签默认是inline-block元素，可以与其他行内元素或行内块元素并排也可以调节高度和宽度；
2. 有关CSS的部分
CSS就让人非常难受，知识点太多太杂，明明我认为很多东西不应该这么复杂，但是事实就是如此，好在有AI来帮助我排版，学CSS或于难受 大概学到浮动的章节彻底不想接着看了，索性让AI生成一份html,我来填充内容并修改颜色， 今天去了解了一下flex元素，看上去挺有用的，或许可以实现让我认为过于复杂的东西简单一些......
代码示例：一个简单的卡片居中
下面是一个使用现代 Flexbox 布局实现卡片居中的典型 CSS 代码：
/* 将容器设置为 Flex 布局并实现居中 */
.container {
display: flex;
justify-content: center; /* 水平居中 */
align-items: center; /* 垂直居中 */
min-height: 100vh;
}
.card {
background-color: #ffffff;
border-radius: 12px;
padding: 24px;
box-shadow: 0 4px 6px rgba(0, 0, 0, 0.1);
}3. 下一步计划
接下来打算多了解一些有关flex的知识，补充上js相关内容