如何用flex布局-横向竖向排列

2024-09-21

注意，这里的flex布局用的是tailwindcss的flex类，而不是css的flex属性。道理是一样的，只是写法不同。


横向排列

从左到右排列：flex flex-row

实践下来，发现flex flex-row是默认的，不用写也可以。

<div class="flex flex-row">
  <div>01</div>
  <div>02</div>
  <div>03</div>
</div>

从右到左排列：flex flex-row-reverse

<div class="flex flex-row-reverse">
  <div>01</div>
  <div>02</div>
  <div>03</div>
</div>

居中排列：flex justify-center

<div class="flex justify-center">
  <div>01</div>
  <div>02</div>
  <div>03</div>
</div>

两端对齐：flex justify-between

<div class="flex justify-between">
  <div>01</div>
  <div>02</div>
  <div>03</div>
</div>

竖直排列

从上到下排列：flex flex-col

<div class="flex flex-col">
  <div>01</div>
  <div>02</div>
  <div>03</div>
</div>

从下到上排列：flex flex-col-reverse

<div class="flex flex-col-reverse">
  <div>01</div>
  <div>02</div>
  <div>03</div>
</div>

自动扩展大小：flex-1

 <div class='flex'>
    <div class='flex-1'>01</div>
    <div class='flex-1'>02</div>
    <div class='flex-1'>03</div>
 </div>

参考链接

https://tailwindcss.com/docs/flex-direction https://tailwindcss.com/docs/flex#flex-1

如何查找中国各省市的GDP和人口数据？

2024-09-21

这篇文章无关编程，只是简单介绍获取中国各省市的GDP和人口数据的方法。

先推荐一些免费有用的链接：

链接推荐

关于出生人口数据

出生人口数据一般包括出生人口数量和出生率。

但是，在我搜索中发现，很多统计数据不会直接给出出生人口数量，需要自己计算。

计算方式：

  • 出生人口数量 = 出生率 * 人口总数

注意，出生率是指每千人口中出生人口的数量。出生率是一个比例，通常以千分之几‰表示（注意百分号后面还有一个o，这是千分号）。

搜索引擎方法

首先，你可以打开搜索引擎，搜索《国民经济和社会发展统计公报》。这是国家统计局每年发布的一份重要统计数据，其中包含了各省市的GDP和人口数据。

具体到每一年、每个省、市，《XX年XX省/市国民经济和社会发展统计公报》。

关于时间，一般来说，国家统计局会在每年的3月份发布上一年的数据。比如2022年的数据，会在2023年3月份发布。

例子： 这是2023年广东省国民经济和社会发展统计公报，根据同样的关键词，可以查询到2022年、2021年的统计公报。

根据以上资料，可以得知，广东省出生人口数量：

2023年出生人口103万人，出生率8.12‰；生产总值135673.16亿元。

2022年出生人口105.20 万人，出生率 8.30‰；生产总值129118.58 亿元。

2021年出生人口118.31万人，出生率9.35‰；生产总值124369.67亿元。