catalouge

by talalala1251

HTML

<h1>塔拉拉想什麼</h1>
<h2>兩個女孩的全職媽媽，持續服役中</h2>
<p>最後更新: Mar. 07, 2022</p>
<h3>索引</h3>
<ol class="word">
<li>社區徵文</li>
<ul>
<li><a href="https://matters.news/@talalala1251/%E9%9B%AA%E5%9C%B0%E4%BE%86%E4%BF%A1-%E5%AF%AB%E7%B5%A6f-bafyreiga4ainl5gwquzf7w5dqked2inzipaicdj4lr6gsasjv3mlr3gzla">雪地來信|寫給F</a></li>
<li><a href="https://matters.news/@talalala1251/2021-matters%E5%B9%B4%E5%BA%A6%E5%95%8F%E5%8D%B7-life-matters-bafyreihytq3kxzcfgx5rzkythw7wcuyeqn6zbjsvz7yuybinxywrm23vhu">2021 Matters年度問卷|Life matters.</a></li>
<li><a href="https://matters.news/@talalala1251/%E8%81%96%E8%AA%95%E6%96%87%E5%AD%97%E5%B8%82%E9%9B%86-%E9%80%90%E6%BC%B8%E6%88%90%E5%BD%A2%E7%9A%84%E5%84%80%E5%BC%8F%E6%84%9F-bafyreibpjruziwqxvwnrrhl4kkpcsoiginnvvif6orkdltxczr5pvs3t7i">聖誕文字市集|逐漸成形的儀式感</a></li>
<li><a href="https://matters.news/@talalala1251/%E6%88%91%E7%9A%84%E5%A3%9E%E7%BF%92%E6%85%A3-%E8%BF%B7%E7%B3%8A-bafyreieyem343xo3yvh5jm3tscwons7fzv2bdhnwlt5l464kp3lhpkiiii">我的壞習慣｜迷糊</a></li>
<li><a href="https://matters.news/@talalala1251/%E9%A6%AC%E7%89%B9%E5%B8%82%E4%BD%9C%E8%80%85%E6%8C%96%E5%AF%B6-bafyreiffecbfjjt66aejviyoopztdkuiswyupy4eiy2usfgrigqqku3fvq">馬特市作者挖寶</a></li>
<li><a href="https://matters.news/@talalala1251/%E9%A6%AC%E7%89%B9%E5%AE%87%E5%AE%99%E5%85%B1%E5%BB%BA%E8%A8%88%E7%95%AB56-%E5%A1%94%E6%8B%89%E6%8B%89%E6%98%9F-bafyreiczqrj4q3wfiw5o2vmz7bmw2xsq46bguyuqkwyqvy6l4qo5hx3dym">馬特宇宙共建計畫56 |塔拉拉星</a></li>
<li><a href="https://matters.news/@talalala1251/%E7%B5%A6%E8%87%AA%E5%B7%B1%E7%9A%84%E6%AD%BB%E5%89%8D%E5%8D%81%E9%A0%85%E5%B7%A5%E4%BD%9C%E6%B8%85%E5%96%AE-bafyreid6qekj7o5epn4wtsabfzvdjmgetnhmsb5lvgsxpw5omda7jvfwca">給自己的死前十項工作清單</a></li>
<li><a href="https://matters.news/@talalala1251/%E4%BA%BA%E7%94%9F%E9%9B%A3%E5%BE%97%E7%9A%84%E9%AB%94%E9%A9%97-%E7%94%A8%E7%A0%B4%E8%8B%B1%E6%96%87%E8%88%87%E5%A4%96%E5%9C%8B%E4%BA%BA%E9%96%8B%E6%9C%83-bafyreifle6dahikeoiku3o5cia6tx64lzsojj3qdqpotjbavrasapqnx4a">人生難得的體驗|用破英文與外國人開會</a></li>
<li><a...

CSS

body {
  background: #fafafa;
  padding: 10px 20px;
}
h1, h2, h3  {
  font-weight: 600;
}
h1 {
  font-size: 20px;
}
h2 {
  font-size: 18px;
}
h3 {
  font-size: 16px;
  color: #4d92eb;
}
p {
  color: #888;
}
.word {
  margin-left: -20px;
}
.link {
  display: inline-flex;
  list-style-type: none;
  margin-left: -40px;
  margin-top: -40px;
  font-size: 14px;
  line-height: 14px;
}
.link ul {
  margin-bottom: -40px;
}
.link > .line::before {
  content:"";
  height: 100%;
  margin: 0 20px;
  border-right: solid 1px #cacaca;
}
a {
  color: #4d92eb;
  text-decoration: none;
  transition: 0.5s;
}
a:hover {
  color: #4079c3;
  text-decoration: none;
}